Javascript three.js Raycaster相交对象
我正在尝试修改three.js,以通过鼠标单击控制角色。首先,当我单击画布时,我需要鼠标坐标,并使用THREE.Raycaster.intersectObjects将其转换为三维空间坐标。在修改后的代码中,在鼠标左上角,我有以下内容:Javascript three.js Raycaster相交对象,javascript,three.js,webgl,Javascript,Three.js,Webgl,我正在尝试修改three.js,以通过鼠标单击控制角色。首先,当我单击画布时,我需要鼠标坐标,并使用THREE.Raycaster.intersectObjects将其转换为三维空间坐标。在修改后的代码中,在鼠标左上角,我有以下内容: var vector = new THREE.Vector3((event.clientX / window.innerWidth) * 2 - 1, -(event.clientY / window.innerHeight) * 2 + 1, 0.5); var
var vector = new THREE.Vector3((event.clientX / window.innerWidth) * 2 - 1, -(event.clientY / window.innerHeight) * 2 + 1, 0.5);
var projector = new THREE.Projector();
projector.unprojectVector(vector, camera);
var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
var intersects = raycaster.intersectObjects(objects);
if (intersects.length > 0) {
console.log('intersect: ' + intersects[0].point.x.toFixed(2) + ', ' + intersects[0].point.y.toFixed(2) + ', ' + intersects[0].point.z.toFixed(2) + ')');
}
else {
console.log('no intersect');
}
我已经将地面网格添加到对象
数组中,但是光线投射器。当我单击地面网格时,intersectObjects
仍然返回空数组。我还试着进入场景。孩子们
而不是对象
,但运气不好
这就是问题所在。显然,陀螺仪是问题所在。去掉这些线,我就得到了相交点。不确定这是错误还是功能
var gyro = new THREE.Gyroscope();
gyro.add( camera );
characters[ Math.floor( nSkins/2 ) ].root.add( gyro );