【问题标题】:three.js: Smoothly spin an object opposite to OrbitControls camera.rotation.y三.js:平滑旋转一个对象对面的OrbitControls camera.rotation.y
【发布时间】:2015-11-12 00:35:44
【问题描述】:

使用OrbitControls 在three.js 中旋转场景,我希望planeMesh 对象始终面向相机。我正在尝试以下操作,但它只是像疯了一样旋转(并且似乎是处理器密集型的),但是当我用鼠标环绕场景(移动相机)时,它看起来像是试图保持正面。我试图让它仅在相机移动时缓慢地重新定向。我在这里做错了什么?

Here's a plunker

这是相关的JS:

function animate() {
   requestAnimationFrame( animate );

   planeMesh.rotation.y -= Math.PI /camera.rotation.y;

   render();
}

我也尝试了以下方法(也没有用):

   function animate() {
     requestAnimationFrame( animate );
     var a = camera.rotation.y; 
     var b = camera.rotation.y; 

     if (a == b) {
       planeMesh.rotation.y -= Math.PI /camera.rotation.y;
       } else {    
     }

     render();
     a = camera.rotation.y; 
}

** 编辑 我希望cameraplaneMesh 彼此保持当前关系。 以下是起始轮换: planeMesh Rotation y = 3.141592653589793 camera Rotation y = -0.06894749489830237

但是,我认为相机使用 THREE.Euler,而 planeMesh 使用 Math.PI 进行旋转,所以......这两个旋转测量使用不同的系统吗?

当然,如果我能得到起点的差异,然后只在差异更大的情况下更改planeMesh rotation.y,但那个差异大于起点差异,那么我将实现我的目标。但是我该怎么做呢?我是否必须以某种方式翻译这两种测量系统?当我旋转场景时,相机似乎使用了不同的测量比例。

【问题讨论】:

    标签: javascript canvas 3d three.js


    【解决方案1】:

    确保飞机始终面向相机的最简单方法是将其简单地附加到相机而不是场景,例如camera.add(planeMesh); 并相对于相机定位平面。然后它们的旋转将始终自然对齐。

    或者,如果两者都是同一个父级(通常是场景)的子级,则使用planeMesh.lookAt(camera.position);

    【讨论】:

    • 啊!杰出的!很简单。谢谢!
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2012-07-19
    • 2017-06-24
    • 2021-08-27
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多