projectVector结果不在-1和1之间（three.js）
注意：下面的代码使用WestLangley的修复程序进行了更新 我试过几个从3D投影到2D的例子。然而，当我尝试使用projectVector时，结果不在-1和1之间，因此当我乘以窗口的宽度/高度时，我得到了非常大的数字（比我的屏幕分辨率大得多）。希望我的问题很简单。我使用的是three.min.js r56，我的内窗尺寸是1366x418 下面的代码生成3D点（1200625100）的预测（x，y）为（-7.874704599380493，-13.403168320655823）。我知道我仍然需要将这个结果乘以我的窗口高度和宽度的一半，但是得到的（x，y）像素远远超出了屏幕projectVector结果不在-1和1之间（three.js）,three.js,webgl,Three.js,Webgl,注意：下面的代码使用WestLangley的修复程序进行了更新 我试过几个从3D投影到2D的例子。然而，当我尝试使用projectVector时，结果不在-1和1之间，因此当我乘以窗口的宽度/高度时，我得到了非常大的数字（比我的屏幕分辨率大得多）。希望我的问题很简单。我使用的是three.min.js r56，我的内窗尺寸是1366x418 下面的代码生成3D点（1200625100）的预测（x，y）为（-7.874704599380493，-13.403168320655823）。我知道我仍然
<html>
<head>
<title>Test</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
<script type="text/javascript" src="three.min.js"></script>
</head>
<body>
<canvas id='container'></canvas>
<script>
/// GLOBAL VARIABLES
var camera, scene, renderer, container, projector;
init();
function toXYCoord (object) {
var vector = projector.projectVector(object.position.clone(), camera);
return vector;
}
/// INIT
function init() {
scene = new THREE.Scene();
camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 0.1, 20000 );
scene.add(camera);
camera.position.set(0,-1500,1500);
camera.lookAt(scene.position);
camera.updateMatrixWorld(); ///////////////// THIS IS THE FIX
projector = new THREE.Projector();
// sphere
var sphere = new THREE.Mesh( new THREE.SphereGeometry( 200, 32, 16 ), new THREE.MeshBasicMaterial({ color: 0x000000 }) );
sphere.position.set(1200,625,100);
scene.add(sphere);
container = document.getElementById('container');
renderer = new THREE.WebGLRenderer( { canvas: container, antialias:true } );
renderer.setSize( window.innerWidth, window.innerHeight );
var testVector = toXYCoord(sphere);
console.log(window.innerWidth + "x" + window.innerHeight);
console.log("Got: (" + testVector.x + "," + testVector.y + ")");
renderer.render( scene, camera );
}
</script>
</body>
</html>
试验
///全局变量
摄像机、场景、渲染器、容器、投影仪；
init（）；
函数toXYCoord（对象）{
var vector=projector.projectVector（object.position.clone（），camera）；
返回向量；
}
///初始化
函数init（）{
场景=新的三个。场景（）；
摄像头=新的三个透视摄像头（50，window.innerWidth/window.innerHeight，0.12000）；
场景。添加（摄影机）；
摄像机位置设置（0，-15001500）；
摄像机。注视（场景。位置）；
camera.updateMatrix（）；//这是修复方法
投影仪=新的三个投影仪（）；
//球体
var sphere=new THREE.Mesh（new THREE.SphereGeometry（200,32,16），new THREE.MeshBasicMaterial（{color:0x000000}））；
球体位置设置（1200625100）；
场景。添加（球体）；
container=document.getElementById（'container'）；
renderer=new THREE.WebGLRenderer（{canvas:container，antialas:true}）；
renderer.setSize（window.innerWidth、window.innerHeight）；
var testVector=toXYCoord（球体）；
console.log（window.innerWidth+“x”+window.innerHeight）；
log（“Got:（“+testVector.x+”，“+testVector.y+”））；
渲染器。渲染（场景、摄影机）；
}
render（）camera.lookAt（）renderer.render( scene, camera );
toXYCoord（）renderer.render( scene, camera );