通过正交相机相交

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

要解决此问题，只需添加此行raycaster.ray.origin.set（mouse.x，mouse.y，-1）.unproject（camera）;

Answer 2

请查看以下示例： 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 );