通过正交相机相交

Question

我在我的项目中使用正交相机。我的问题是光线投射器。它工作正常，但不正确。对象不会在其所有宽度或高度上拾取。有时它只适用于对象的一半。但是当我通过轨道控制移动相机时，raycaster 可以正常工作。我忘了说我使用 GPUpicker 库

我的项目：https://alovert.ru

默认相机为透视，若要切换为正交，请按键盘上的“O”。

要查看问题，您必须单击立方体侧面和光束的较小侧面。通过这种方式，您可以将新对象添加到场景中。当您尝试添加新对象时，您会看到对象的某些部分在您移动相机之前没有相交。使用透视相机可以正常工作。我很感激任何帮助！

---

我的代码交集

function onMouseClick(e) {
  e.preventDefault();

  mouse.x = e.clientX;
  mouse.y = e.clientY;
  var raymouse = new THREE.Vector2();
  raymouse.x = ((event.clientX - renderer.domElement.offsetLeft) / renderer.domElement.width) * 2 - 1;
  raymouse.y = - ((event.clientY - renderer.domElement.offsetTop) / renderer.domElement.height) * 2 + 1;

  raycaster.setFromCamera(raymouse, activeCamera);

  var intersect = gpuPicker.pick(mouse, raycaster);
}

Answer 1

请看这个例子： https://threejs.org/examples/#webgl_interactive_cubes_ortho

代码： https://github.com/mrdoob/three.js/blob/master/examples/webgl_interactive_cubes_ortho.html

试试这个：

var camera = new THREE.OrthographicCamera(0, window.innerWidth, -window.innerHeight, 0, -100, 100);

var raycaster = new THREE.Raycaster(); // create once
var mouse = new THREE.Vector2(); // create once

...

mouse.x = ( event.clientX / renderer.domElement.clientWidth ) * 2 - 1;
mouse.y = - ( event.clientY / renderer.domElement.clientHeight ) * 2 + 1;

raycaster.setFromCamera( mouse, camera );

var intersects = raycaster.intersectObjects( objects, recursiveFlag );

Answer 2

要解决这个问题，只需添加这一行 raycaster.ray.origin.set( mouse.x, mouse.y, - 1 ).unproject( camera );