三个JS投影问题

时间:2015-07-10 14:57:02

标签: javascript three.js

我试图在3d空间中查看多边形的中心,然后将其点转换为2d屏幕坐标。这是不起作用的代码。任何帮助将不胜感激。

//calculate the center
var center = new THREE.Vector3();
for (var i = 0; i < positions.length; i++) {
    center.add(positions[i]);
}
center.multiplyScalar(1 / positions.length);
//look at the center
var camera = new THREE.PerspectiveCamera(75, width / height, 0.1, 1000);
camera.lookAt(center);
//calculate the screen coordinates
for (var i = 0; i < positions.length; i++) {
    screenPositions.push(toScreenXY(positions[i], camera, width, height));
}

function toScreenXY(position, camera, width, height) {
    var pos = position.clone();
    pos.project(camera);
    var halfWidth = width / 2,
        halfHeight = height / 2;
    return {
        x: (pos.x + 1) * halfWidth + halfWidth,
        y: (-pos.y + 1) * halfHeight + halfHeight
    };

}

好像相机变换对投影没有影响

1 个答案:

答案 0 :(得分:1)

由于您更改了相机的旋转,因此您需要更新相机的世界矩阵,因为方法project()会引用它。

camera.position.set( x, y, z );
camera.lookAt( center );

camera.updateMatrixWorld(); // add this

渲染器在camera.updateMatrixWorld()为您调用renderer.render(),但在这种情况下,您必须自己调用它。

three.js r.71