Hello,

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!