Sorry your browser is not supported!

You are using an outdated browser that does not support modern web technologies, in order to use this site please update to a new browser.

Browsers supported include Chrome, FireFox, Safari, Opera, Internet Explorer 10+ or Microsoft Edge.

DarkBASIC Professional Discussion / mouse coords to isometric tile?

Author
Message
Phaelax
DBPro Master
23
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 7th Aug 2012 20:31
I spent a few hours on trying to figure this out last night and haven't had much luck. I thought it'd be simple but I can't seem to wrap my head around it. Any ideas?



"You're not going crazy. You're going sane in a crazy world!" ~Tick
Sasuke
20
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 7th Aug 2012 22:49
I did this once and I found it a nightmare because of the drawing. Combining the correct way of drawing the grid with the math that aligns correctly is a pain and a half.

If DBP had a better matrix library this would be quite simple, but since it doesn't we have to do it the hard way. Now I swear I did it by rotating the grid back to a square projection. Hmm... let me have a play quick.

Wheres Neuro Fuzzy when you need him?
basjak
16
Years of Service
User Offline
Joined: 16th Apr 2010
Location: feel like signing up for mars
Posted: 7th Aug 2012 22:53
Sorry to say that's easy. Isometric dimention occur when you turn x,y according to the equation Y=a*X + b.

By putting this equation in mind, you can easily create a flat surface.

Now if the tile size = 60 units.
-> pointx = mousex()
-> pointy = a*pointx + b

Player would be on tile:
Tx = pointx / 60
Ty = pointy / 60


Remember that tx and ty are int because the number of tiles is int.

I wrote this one from my mobile. So I hope I haven't' done a mistake.

Sasuke
20
Years of Service
User Offline
Joined: 2nd Dec 2005
Location: Milton Keynes UK
Posted: 7th Aug 2012 23:04
Hey basjak, what's 'a' and 'b' in that equation?
basjak
16
Years of Service
User Offline
Joined: 16th Apr 2010
Location: feel like signing up for mars
Posted: 7th Aug 2012 23:18
a and b are constant values for each isometric line. Change b if you want to add a parallel line to the previous line.

When I get home I will write a program to show how easy to draw such tiles.

Neuro Fuzzy
19
Years of Service
User Offline
Joined: 11th Jun 2007
Location:
Posted: 8th Aug 2012 04:11 Edited at: 8th Aug 2012 06:05
@ Basjak: But in Phaelax's example neither line is aligned with an axis. If I understand your method that would make it not work.

I have to go for an hour or so, so I'll post what I've done and come back to it later. Haven't tried to solve the problem, but I did generalize the isometric-ness so that I don't have to deal with the magic numbers (32/64)


Basically, the axis vectors i and j (not unit length) define the coordinate system for the isometric grid. To convert from mouse coordinates, you'd need to take the vector from the pixeloffset to the mouse, and take the dot product with both vector i and vector j. (multiplied by the scale). Round each of those down to an integer and you'll have the x and y coordinate! Of course once you use this in your game you can simplify the math for the i and j vectors and you won't have to do this explicitly, but this is essentially what basjak was doing (just with an x unit vector that points in a different direction)





Quote: "Wheres Neuro Fuzzy when you need him?"

I always get a huge smile on my face when I read things like this :3

[edit]
Alright, I got it working with a lot of comments on the linear algebra:


To get the angles and everything like phaelax's was, we can set i=(32,-16) (negative being UP), j=(32,16). (and scale=1, meaning ignore it). That simplifies down to this:


Burning Feet Man
18
Years of Service
User Offline
Joined: 4th Jan 2008
Location: Sydney, Australia
Posted: 8th Aug 2012 09:38 Edited at: 8th Aug 2012 09:44
I'm a big fan of isometric/orthographic views. I've done a bunch of trial and errors with DLL's and plugins, but found I could do what I was trying to do by simply configuring the camera with stock DBPro commands.

Attached is an example of a simple program that flicks between orthographic (isometric) and perspective (depth).

EDIT: Woo! Yes, it's in 3D. But that makes the whole mouse coordinates thing a piece of cake! ^_^

Help build an online DarkBASIC Professional help archive.
DarkBasic Help Wikia
Pincho Paxton
23
Years of Service
User Offline
Joined: 8th Dec 2002
Location:
Posted: 8th Aug 2012 14:36 Edited at: 8th Aug 2012 14:43
I store the tile positions as x/y (you can also work them out mathematically), then I get the Mousex(), and Mousey(), and you add the tilewidth, and height. Then lock the position to the tile x/y that is nearest. You need to then keep this tile position until you move the mouse, and then search for the next nearest. Although I find it hard to explain, it works, and is quite small code. So mainly a distance formula like this...

d = distance(mousex(),x+Tilewidth,mousey(),y+Tileheight)
if d < mindist
mindist = d
Endif

I would post more code but it was written in DB Classic, and has a sprite trail bug in DBPro. But it will lock to any irregular grid pattern. I have used it with triangles.

Diggsey
20
Years of Service
User Offline
Joined: 24th Apr 2006
Location: On this web page.
Posted: 9th Aug 2012 21:10
One way you could do it:
- Multiply the Y coordinate by a scale value so that you can treat the tiles as if they are perfect squares instead of diamonds.

- Apply the rotation formula with an angle of 45 degrees:
newx# = (x#-y#)/sqrt(2.0)
newy# = (x#+y#)/sqrt(2.0)

- Now you have coordinates on a simple 2D grid, so just divide by the tile size and use the 'floor' function to get the 'x' and 'y' indices into that grid.

[b]
Phaelax
DBPro Master
23
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 11th Aug 2012 21:14 Edited at: 11th Aug 2012 21:16
So close, but it seems off just a little bit and can't figure out why.



"You're not going crazy. You're going sane in a crazy world!" ~Tick
Neuro Fuzzy
19
Years of Service
User Offline
Joined: 11th Jun 2007
Location:
Posted: 12th Aug 2012 01:06
The coordinate system isn't agreeing with the way you're drawing them. I can tell the transform is fine, because:


With your draw function, when you draw a tile at (x,y), the point (x,y) actually lies outside of the tile. This is weird to think about mathematically, and it's really an arbitrary point that happens to work out nice mathematically. I like to have a coordinate (0,0) represent the furthest (in this case leftmost) point on the grid. In your case, you've set it up so that (0,0) is the topmost grid, so we'd want drawIsoSquare(x,y) to draw like so:


Also, it probably doesn't matter for you, but the tiles with negative coordinates will be calculated wrong if you just cast to integers instead of using the floor function (-.1 casts to 0 but should go to -1)

Phaelax
DBPro Master
23
Years of Service
User Offline
Joined: 16th Apr 2003
Location: Metropia
Posted: 12th Aug 2012 01:19
Thanks, that was it! I figured it was something along those lines but couldn't quite find it.

"You're not going crazy. You're going sane in a crazy world!" ~Tick

Login to post a reply

Server time is: 2026-07-23 02:36:51
Your offset time is: 2026-07-23 02:36:51