Cursor with rayOrigin mouse and ortho camera does not intersect entities as expected #4935
Description
Description:
When in orthographic camera view, it is only possible to select an entity directly within the center of the canvas, clicking other entities in the scene does not select them.
(To reproduce go to inspector, choose top-down or other ortho view, click an entity directly in the center of the frame -- it works, click an entity outside the center of the frame -- it is not selected)
- A-Frame Version: 1.2+
- Platform / Device: Desktop
- Reproducible Code Snippet or URL: any a-frame scene, press ctl-alt-i to open inspector
Cause:
The cursor component updates the raycaster origin and direction at onMouseMove:
aframe/src/components/cursor.js
Line 196 in b164623
In this function, it sets origin and direction here:
aframe/src/components/cursor.js
Line 224 in b164623
This corresponds to the three.js raycaster's perspective case:
https://github.com/mrdoob/three.js/blob/master/src/core/Raycaster.js#L34
But there is no corresponding case to handle ortho mode in the A-Frame cursor.
Proposed solution:
Copy the three.js solution to check for camera type to use separate origin and direction method for ortho and perspective.
Replace lines 224 and 225 here:
aframe/src/components/cursor.js
Line 224 in b164623
Replace with:
if (camera && camera.isPerspectiveCamera) {
origin.setFromMatrixPosition(camera.matrixWorld);
direction.set(mouse.x, mouse.y, 0.5).unproject(camera).sub(origin).normalize();
} else if (camera && camera.isOrthographicCamera) {
origin.set(mouse.x, mouse.y, (camera.near + camera.far) / (camera.near - camera.far) ).unproject(camera); // set origin in plane of camera
direction.set(0, 0, -1).transformDirection(camera.matrixWorld);
} else {
console.error( 'AFRAME.Raycaster: Unsupported camera type: ' + camera.type );
}