对Three.js来说是非常新的东西,并且通常会进行编码,所以请耐心等待。我正在尝试实现一些可拖动的多维数据集,类似于threejs.org上的示例,但是我的代码的特定部分中的raycaster出现了问题。出于某种原因,选择我的立方体后,光线投射器不会返回与我的平面几何形状的交点。下面是特定的代码块。任何帮助将非常感激。
function onDocumentMouseMove(event) {
event.preventDefault();
mouse.x = ((event.clientX - 70)/renderer.domElement.width) * 2 - 1;
mouse.y = ((event.clientY - 50)/renderer.domElement.height) * 2 + 1;
var raycaster = new THREE.Raycaster();
raycaster.setFromCamera( mouse, camera );
if (SELECTED) {
var intersects = raycaster.intersectObject(plane);
SELECTED.position.copy( intersects[ 0 ].point.sub( offset ) );
return;
}
var intersects = raycaster.intersectObjects(objects);
if (intersects.length > 0) {
INTERSECTED = intersects[0].object;
plane.position.copy(INTERSECTED.position);
plane.lookAt(camera.position);
}
render();
};
以下是用于选择多维数据集的mouseDown事件:
function onDocumentMouseDown(event) {
event.preventDefault();
mouse.x = ( ( event.clientX - 70 ) / renderer.domElement.width ) * 2 - 1;
mouse.y = - ( ( event.clientY - 50 ) / renderer.domElement.height ) * 2 + 1;
var vector = new THREE.Vector3( mouse.x, mouse.y, 0.5);
vector = vector.unproject(camera);
var raycaster = new THREE.Raycaster(camera.position, vector.sub(camera.position).normalize());
var intersects = raycaster.intersectObject(cube);
if (intersects.length > 0) {
intersects[0].object.material.color.setHex(0xff0000);
SELECTED = intersects[ 0 ].object;
var intersects = raycaster.intersectObject( plane );
offset.copy( intersects[ 0 ].point ).sub( plane.position );
}
render();
};
找出我的错误。我在onMouseMove函数中缺少mouse.y的“-”。
mouse.x = ((event.clientX - 70)/renderer.domElement.width) * 2 - 1;
mouse.y = -((event.clientY - 50)/renderer.domElement.height) * 2 + 1;
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句