Mouse position to world position in isometric view

Questions
, , ,
1

I was previously using a 2D screen and PerspectiveCamera. Now I changed it to OrthographicCamera to achieve an isometric view.

I want to find the world coordinates from the mouse position. Previously, I was using these code pieces: point - Mouse / Canvas X, Y to Three.js World X, Y, Z - Stack Overflow

Now since I changed my Camera to Orthographic one, now I use this code to find world coordinates from mouse click:

let vector = new THREE.Vector3();
vector.set(
    (event.clientX / window.innerWidth) * 2 - 1,
    - (event.clientY / window.innerHeight) * 2 + 1,
    0
);
vector.unproject(camera);

This is mostly working for 2D world but when I change my camera’s position to achieve an isometric, 3d-ish view like below code, it’s not working:

controls.setLookAt(x, y - 500, z, x, y, 0);

I use the camera-controls library (GitHub - yomotsu/camera-controls: A camera control for three.js, similar to THREE.OrbitControls yet supports smooth transitions and more features.)

With the above code I can achieve an isometric view with setting the camera’s y position like y - 500. But when I do that my code for finding the world coordinates messed up.

I tried to reflect the camera’s position (minus 500 offset) to that vector calculation (by increasing the y coordinate of the vector) but it’s not working since the difference is not always the same in an isometric view. How can I keep the isometric view and also find the world position from mouse click.

2

Here is an isometric example that uses spherical coordinates to set the camera view. Are you able to get the correct position using method? Depending on the “type” of isometric view, you can adjust the rotation (in this case 0.523599):

camera.position.setFromSphericalCoords(1, 0.523599 * 2, Math.PI / 4)
1 Like
3

Nope, this is making no difference. It might be because of the camera-controls library is overwritten something or not. I also was able to tilt the camera by changing the Y position of it or rotating the controls. The problem is that I can not get the position of where I click.