Question

Three.js：rev 73

我正在使用以下构造来查找鼠标点击与3d世界（正交设置）中的对象的交集：

function onDocumentMouseDown(event) {
  event.preventDefault();
  console.log("Click");

  var mouse = new THREE.Vector2();
  mouse.x = (event.clientX / window.innerWidth) * 2 - 1;
  mouse.y = -(event.clientY / window.innerHeight) * 2 + 1;

  var raycaster = new THREE.Raycaster();
  // update the picking ray with the camera and mouse position	
  raycaster.setFromCamera(mouse, camera);

  // calculate objects intersecting the picking ray
  var intersects = raycaster.intersectObjects(scene.children);

  console.log("intersects: " + intersects.length);

  for (var i = 0; i < intersects.length; i++) {
    console.log(intersects[i].point);
  }

}

但是，交叉路口非常不准确。当我单击框的左上角附近时捕获交叉点。

jsFiddle：有人可以帮我理解为什么会出现这种行为不端的行为？

此外，如果没有选择任何对象，我想找出相对于方框的3d世界中的点击位置 - 左侧，右侧，框下方？我可以使用光线本身来计算它吗？

Answer 1

你必须为光线投射获得准确的鼠标位置： -

  mouse.x = ( (event.clientX -renderer.domElement.offsetLeft) / renderer.domElement.width ) * 2 - 1;
   mouse.y = -( (event.clientY - renderer.domElement.offsetTop) / renderer.domElement.height ) * 2 + 1;

在窗口调整大小时必须触发事件侦听器我再次更新小提琴检查它。添加窗口调整大小的新功能... 代码是自我解释的...希望你明白了。

立即检查更新小提琴

更新小提琴： - http://jsfiddle.net/gc1v0rza/5/

用正交相机将鼠标单击转换为3d空间

1 个答案: