将3d坐标转换为2d屏幕坐标(平面网格)

时间:2015-01-15 10:05:13

标签: javascript 3d three.js

你好我有一个宽度为5000,高度为5000的three.js的飞机。使用下面的代码我将3d坐标转换为2d,更具体的是我得到了飞机的左上角和右下角。 我用位置x:0,y:0,z:70000和旋转x:0,y:0,z:0初始化我的相机。

如果我不旋转相机(使用轨道控制),我得到的坐标是正确的:

enter image description here

然而,如果我旋转我的相机,坐标不正确,我无法弄清楚原因。 到目前为止,这是我的代码:

var vec3 = new THREE.Vector3();
    vec3.set( _that.model.position.x - 2500, _that.model.position.y + 2500, _that.model.position.z ); // top left corner
    vec3.project( _that.vise.camera );

var percX = Math.abs(vec3.x + 1) / 2;
var percY = Math.abs(-vec3.y + 1) / 2;

this.topLeft = {
    x : percX * _that.vise.options.generic.container.clientWidth,
    y : percY * _that.vise.options.generic.container.clientHeight
}

var vec4 = new THREE.Vector3();
    vec4.set( _that.model.position.x + 2500, _that.model.position.y - 2500, _that.model.position.z ); // top left corner
    vec4.project( _that.vise.camera );

var percX = Math.abs(vec4.x + 1) / 2;
var percY = Math.abs(-vec4.y + 1) / 2;

this.bottomRight = {
    x : percX * _that.vise.options.generic.container.clientWidth,
    y : percY * _that.vise.options.generic.container.clientHeight
}

this.projectedVector = {
    x : Math.abs(this.topLeft.x - this.bottomRight.x),
    y : Math.abs(this.topLeft.y - this.bottomRight.y)
}

1 个答案:

答案 0 :(得分:0)

看看这个:

http://www.threejsgames.com/extensions/#threex.objcoord

它包含3D到屏幕位置的翻译,这是你想要的吗?