1
\$\begingroup\$

Been having a difficult time transforming 2D screen coordinates to 3D isometric space. This is the situation where I am working in 3D but I have an orthographic camera. Then my camera is positioned at (100, 200, 100), Where the xz plane is flat and y is up and down.

I've been able to get a sort of working solution, but I feel like there must be a better way.

Here's what I'm doing:

With my camera at (0, 1, 0) I can translate my screen coordinates directly to 3D coordinates by doing:

mouse2D.z = (( event.clientX / window.innerWidth ) * 2 - 1) * -(window.innerWidth /2); mouse2D.x = (( event.clientY / window.innerHeight) * 2 + 1) * -(window.innerHeight); mouse2D.y = 0; 

Everything okay so far. Now when I change my camera back to (100, 200, 100) my 3D space has been rotated 45 degrees around the y axis and then rotated about 54 degrees around a vector Q that runs along the xz plane at a 45 degree angle between the positive z axis and the negative x axis.

So what I do to find the point is first rotate my point by 45 degrees using a matrix around the y axis. Now I'm close.

So then I rotate my point around the vector Q. But my point is closer to the origin than it should be, since the Y value is not 0 anymore. What I want is that after the rotation my Y value is 0. So now I exchange my X and Z coordinates of my rotated vector with the X and Z coordinates of my non-rotated vector. So basically I have my old vector but it's y value is at an appropriate rotated amount.

Now I use another matrix to rotate my point around the vector Q in the opposite direction, and I end up with the point where I clicked.

Is there a better way?

I feel like I must be missing something. Also my method isn't completely accurate. I feel like it's within 5-10 coordinates of where I click, maybe because of rounding from many calculations. Sorry for such a long question.

\$\endgroup\$
4
  • \$\begingroup\$ I'm not sure about the title but if you are usin gXNA there was a question in the 2 past weeks that was asking hte same thing. \$\endgroup\$ Commented May 27, 2011 at 7:28
  • \$\begingroup\$ This question might help you, though the coordinate system was based on 2d screen to isometric: gamedev.stackexchange.com/questions/12362/… \$\endgroup\$ Commented May 27, 2011 at 13:29
  • \$\begingroup\$ Hi, I don't think the 2d answer will help. I'm trying to convert a coordinate like (400, 0) from the screen to something like (280, 0, 280) that lives in 3D space. I saw the XNA question, gamedev.stackexchange.com/questions/7060/… but as far as I could tell it never got answered. I have my screen coordinates in a (-1.0, 1.0) range. Like described in that question, unproject doesn't work for me with orthographic perspective. I'm using Three.js btw. WebGL. \$\endgroup\$ Commented May 28, 2011 at 9:58
  • \$\begingroup\$ -1 anything wrong with using your debugger? also a google research would give you a proper code example in seconds \$\endgroup\$ Commented Jun 27, 2011 at 21:54

1 Answer 1

4
\$\begingroup\$

I finally found the answer.

https://stackoverflow.com/questions/912418/unprojecting-an-on-screen-point-back-to-an-isometrically-projected-world

\$\endgroup\$
2
  • 2
    \$\begingroup\$ -1 do your research first! \$\endgroup\$ Commented Jun 27, 2011 at 21:55
  • 3
    \$\begingroup\$ You can still do your research first and end up with nothing, no reason to shame him for finally finding his answer. \$\endgroup\$ Commented Nov 18, 2015 at 3:41

You must log in to answer this question.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.