Jump to content
  • Advertisement
Sign in to follow this  

reversing isometric projection

This topic is 2116 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts



Sorry about this, I gather isometric questions are quite commonplace but I couldn't find anyone with exactly the issue I'm having. I'm creating a pretty basic isometric grid in JavaScript and am using http://sylvester.jcoglan.com/docs.html Sylvester to provide matrix / vector objects to actually do the projection. I followed a Wikipedia article http://en.wikipedia.org/wiki/Isometric_projection to actually create a matrix to transform from world co-ordinates  to screen co-ordinates (isometric) but modified the angles they suggest slightly as per a different source for nice even lines.


My transformation matrix building code looks like this: 

var transform = Matrix.RotationX(60 * (Math.PI / 180)).x(Matrix.RotationZ(45 * (Math.PI / 180))); 

I then for each tile co-ordinate multiply that matrix by the vector to get a transformed vector:

tileToScreen: function(x, y) {
    var out = transform.dup().x(Vector.create([x, y, 1]));
    return {x: out.e(1), y: out.e(2)};

This all works and I end up with a nice looking isometric grid. As such I was hoping it'd be pretty simple to reverse the transformation and get back the original tile co-ordinates for the purposes of picking but I seem to be entirely unable to do so. My experience with such transforms is pretty limited unfortunately.


I'd been hoping to simply reverse the order & sign of my transform matrix generation methods:

screenToTile: function(x, y) {
    var v = Vector.create([x, y, 1]);
    var out = Matrix.RotationZ(-45 * (Math.PI / 180)).x(Matrix.RotationX(-60 * (Math.PI / 180)).x(v));
    return {x: out.e(1), y: out.e(2)};

I've attached the result I get. I suspect I'm making a pretty silly amateur mistake here but I'd be grateful if anyone were able to help or point me in the direction of some resources on this subject that I might've missed!


Share this post

Link to post
Share on other sites
Sign in to follow this  

  • Advertisement

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

GameDev.net is your game development community. Create an account for your GameDev Portfolio and participate in the largest developer community in the games industry.

Sign me up!