3

我正在尝试从 three.js 修改此示例,以通过鼠标单击来控制字符。首先,当我单击画布时,我需要鼠标坐标并使用 THREE.Raycaster.intersectObjects 将其转换为 3D 空间坐标。在修改后的代码中,鼠标左键向上,我有以下内容:

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');
}

我已将地面网格添加到objects阵列中,但raycaster.intersectObjects单击地面网格时仍返回空数组。我也尝试过传入scene.children而不是objects,但没有运气。

这是完整的修改源

4

1 回答 1

2

显然,陀螺仪是问题所在。取出这些线,我得到相交工作。不确定这是错误还是功能。

var gyro = new THREE.Gyroscope();
gyro.add( camera );
characters[ Math.floor( nSkins/2 ) ].root.add( gyro );
于 2013-03-25T02:28:08.290 回答