the two screenX's return results that differ wildly, when the rectangles are drawn at the same x position.
The strange thing is, I tried it in Processing and it actually returns the correct results. Is this a bug?
Here's a screenshot. You can see the (screen) X positions are rather close, but the returned results differ by about 100.
What I *really* need to do is figure out where the mouse is relative to shapes I draw under a series of matrix transforms: if there's a different way to do that, let me know. I can't reapply the transforms to the mouse points because Processing has no getMatrix() (or at least, processing.js doesn't) and I'm not good enough at Math to do it manually, especially because I have a shear. Also, I'm not using 3D, so modelXYZ won't work.
Hello, I'm having trouble with my transformations. I'm trying to make an isometric grid by shearing 30 degrees and then rotating 30 degrees, but it distorts my squares and makes them into rectangles instead of rhombuses. Shearing alone and rotating alone both work how I expect.
This is what it looks like with shearing alone:
This is what it looks like with rotating alone:
This is what it looks like when I shear and then rotate:
Rotating first and then shearing gives a better result, but still wrong:
The vertical is still off. the diagonals aren't perpendicular to each other. (or if they are, they're not horizontal and vertical).
Is this unintuitive behavior the correct behavior? If so, is there a correct series of transformations to use to get me a proper isometric grid? i.e., made up of rhombuses, whose diagonals are vertical and horizontal, with angles of 60 and 120 degrees?
Thanks in advance for the help!
The code is simply this: (i'm using processing.js, which explains the p object)