Question

我尝试做一个代表相机旋转的球体的动画，我画了一个圆圈（用THREE.TorusGeometry绘制）。

然后，我在由摄像机位置到原点(0,0,0)的方向定义的当前点上投影平面。

对于由y=0和x²+z²=1定义的圆（即定义为Oxz平面=球体赤道平面的圆），您可以看到结果：

link 1 : circle defined by y=0 and x²+z²=1

正如你所看到的，平面的坐标很好，但我无法理解为什么黄色圆圈没有被绘制到Oxz平面（在这个链接中，你可以看到它在Oxy平面中）。 / p>

在矩阵乘法之前，我在Torus矢量上面定义了：

 var coordTorus = new THREE.Vector3(radius*Math.cos(timer), 0, radius*Math.sin(timer));

即x'²+z'²=1和y'=0（选择2）。在这种情况下，我没有得到黄色圆圈的有效结果，它被绘制到Oxy平面而不是像预期的那样进入Oxz平面。

为了获得好结果，我必须在本地平面定义x'²+y'²=1和z'=0，但我不明白为什么？

如果有人能告诉我解释？

Answer 1

很难从所有代码中提取您的问题。我清理了一些东西并以不同的方式解决了它，我认为 this Fiddle 显示了你想要的东西。

而不是旋转所有旋转相机的物体，这似乎比你的解决方案简单得多：

/**
 * Rotate camera
 */
function rotateCamera() {

    // For camera rotation 
    stepSize += 0.002;

    alpha = 2 * Math.PI * stepSize;

    if (alpha > 2 * Math.PI) {
        stepSize = 0;
    }

    // Rotate camera around a circle
    camera.position.x = center.x + distance * Math.cos(alpha);
    camera.position.z = center.y + distance * Math.sin(alpha);

    // Camera should look at center
    camera.lookAt(new THREE.Vector3(0, 0, 0));

}

然后我将切平面添加到相机而不是场景：所以它随着相机旋转。

camera.add(plane);

Three.js - 绘制圆环但无法理解方程式定义它

1 个答案: