0

我创建了一个圆柱体几何形状的圆锥体。然后当我想用lookAt函数旋转圆锥指向X轴的正方向时,它就不起作用了。我的代码有什么问题吗?或者这是 Three.js 的错误?

您还可以在 jsFiddle 上查看我的代码:http: //jsfiddle.net/ysmood/CRdxP/

class Stage
    constructor: ->
        @init_scene()
        @make_meshes()

    init_scene: ->
        @scene = new THREE.Scene

        # Renderer
        width = window.innerWidth;
        height = window.innerHeight;
        @renderer = new THREE.WebGLRenderer({
            canvas: document.querySelector('.scene')
        })
        @renderer.setSize(width, height)

        # Camera
        @camera = new THREE.PerspectiveCamera(
            45,                 # fov
            width / height,     # aspect
            1,                  # near
            1000                # far
        )
        @camera.position.z = 200;
        @scene.add(@camera)

    make_meshes: ->
        size = 20
        @mesh = new THREE.Mesh(
            new THREE.CylinderGeometry(
                0, size, size
            ),
            new THREE.MeshNormalMaterial()
        )
        @scene.add(@mesh)

        # I want the mesh's tip point to right, but it doesn't work.
        @mesh.lookAt(new THREE.Vector3(1, 0, 0))

    draw: =>
        @renderer.render(@scene, @camera)

stage = new Stage
stage.draw()
4

2 回答 2

5

默认情况下,所有网格都有一个lookAt向量设置为(0,0,1)up向量设置为(0,1,0)。通过将lookAt矢量设置为(1,0,0)您实际上将您的网格绕 y 轴旋转了 90 度。

看这个演示:http ://threejs.org/examples/misc_lookat.html

你会找到

geometry.applyMatrix( new THREE.Matrix4().makeRotationFromEuler( new THREE.Vector3( Math.PI / 2, Math.PI, 0 ) ) );

该命令修改几何形状,使圆锥的尖边现在沿着 z 轴放置,然后它用于mesh.lookAt(someVector)重新定向网格以查看空间中的某个所需点。

希望这可以帮助。

于 2013-07-16T12:21:53.100 回答
4

我自己对 camera.up 向量有这个问题,所以我编写了自己的 lookAt 函数,它不使用 up 向量。它只是将相机指向目标位置,保持当前滚动。

CameraUtils.lookAt = function(camera, targetPosition) {
    var targetPos = camera.worldToLocal(targetPosition.clone());
    var rotationAxis = new THREE.Vector3().crossVectors(
        new THREE.Vector3(0, 0, -1),
        targetPos
    ).normalize();
    var angle = new THREE.Vector3(0, 0, -1).angleTo(
        targetPos.normalize().clone());

    camera.rotateOnAxis(rotationAxis, angle);
}

像这样称呼它:

CameraUtils.lookAt(camera, myObject.position);

我希望它有所帮助。

于 2014-12-06T06:05:51.320 回答