相机旋转

一、实现物体的转动有2种方法

(1)物体本身的转动

cube.rotation.y -= 0.002;

(2)相机的转动一般是围绕着世界坐标的Y轴,并设置相机的lookAt(new THREE.Vector3(0,-100,0))

    let t0 = new Date()
    function animate() {
        controls.update();
        let t1 = new Date(); //本次时间
        let t = t1 - t0; // 时间差

        //camera.translateX(0.001 * t/3) //沿着Y轴旋转着从大到小

        //camera.translateZ(0.001 * t/3) //沿着Z轴由近到远

        camera.rotateY(0.0001 * t/3); //物体的均匀从左到又平移可以用相机旋转Y轴来实现

        camera.lookAt(scene.position); camera.lookAt与orbitcontrol冲突不能使用,要用下面的controls.target代替
        //controls.target = new THREE.Vector3(0,-100,0);
        renderer.render(scene, camera);
        requestAnimationFrame(animate);
    }

虽然上面已经设置了相机的rotateY与lookAt,但是lookAt并没有效果?

原因是由于引用了OrbitControls控件,相机的lookAt 被OrbitControls控件更改了。

camera.lookAt()代码要使用 controls.target = new THREE.Vector3(0,-100,0);来替换,就可以更改你想要的视角。但是相机的旋转怎么处理呢?

控制器有自带的旋转设置

controls = new THREE.OrbitControls(camera, renderer.domElement);
controls.autoRotate = true; 

controls有点像我们的相机。在设置了controls.autoRotate = true; 之后,其实我们并不需要controls.target = new THREE.Vector3(0,-100,0);

二、相机的旋转和移动,使我们可以做很多有趣的效果

camera.translateX(0.001 * t/3) //沿着Y轴旋转着从大到小
camera.translateZ(0.001 * t/3) //沿着Z轴由近到远

camera.rotateY(0.0001 * t/3); //物体均匀的从左到右平移

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • Vuecli 配合后端php 原

    在很多情况下前端并不清楚后端与前端怎么协同工作的,下面的例子是后端用的php集成包wamp,

    tianyawhl
  • 响应式状态时的jqprint打印 原

    最近需要打印,使用jqprint 进行打印,页面状态是电脑平板都能正常显示的响应式页面,打印时由于要打印在一个A4纸上,需要定义打印的宽度,并且点击打印的同时,...

    tianyawhl
  • 实现loading的代码 原

    (adsbygoogle = window.adsbygoogle || []).push({});

    tianyawhl
  • BerkeleyDB .je 在作为存储时的简单使用

    最近在研究BDB时发现速度特别快(非关系型数据库)下面我给大家共享一下我在学习的过程中的一些收获和问题,不知道哪位大神帮忙解决一下。主要在putNoDupDa...

    用户5166556
  • 从零手写RPC

    java404
  • Hutool Java工具类库导出Excel,超级简单!

    以前用过POI、easyexcel等工具的导入导出功能,但总感觉太麻烦了,代码特别多,感觉并不是很好用。

    用户1516716
  • 教你用 Netty 实现一个简单的 RPC!

    众所周知,dubbo 底层使用了 Netty 作为网络通讯框架,而 Netty 的高性能我们之前也分析过源码,对他也算还是比较了解了。今天我们就自己用 Nett...

    Java技术栈
  • Netty实现一个简单的 RPC

    众所周知,dubbo 底层使用了 Netty 作为网络通讯框架,而 Netty 的高性能我们之前也分析过源码,对他也算还是比较了解了。今天我们就自己用 Nett...

    用户5224393
  • Amdocs通过ONAP获得微软的订单

    SDNLAB
  • 笔记——Android零碎知识摘录(一)

    1、android:exported属性:主要作用是:是否支持其它应用调用当前组件。默认值:如果包含有intent-filter 默认值为true; 没有int...

    紫兮木溪

扫码关注云+社区

领取腾讯云代金券