Page 1 of 1

Center STI Isometric Map when scaling

Posted: Tue Sep 12, 2017 8:10 pm
by dan369
Hi,

Currently trying to keep my STI isometric map centered when increase the scale factor but can't quite get the math to check out.
Below is what i am doing to set my camera position (tx / ty);

Code: Select all

-- Calculated each time the scale changes
	tx =  ((windowWidth - (map.width * map.tilewidth * scale)) / 2);
	ty =  ((windowHeight - (map.height * map.tileheight * scale)) / 2);
	
-- love.draw
map:draw(tx, ty, scale, scale);
This works fine for a scale factor of 1 but as i move, it almost curves. Not quiet sure what i'm missing from the calculation.
Any help greatly appreciated. :awesome:

Re: Center STI Isometric Map when scaling

Posted: Wed Sep 13, 2017 6:40 am
by erasio
The most important factor is the position. We wanna move the screen around the position but the position is what it's all about.

So we start with that and add some more stuff. By default the upper left is the position. Down and towards the right is where the coordinates get larger so we do want to subtract some value to move the position from the upper left to the center.

Then we need to know how much area the screen covers. This is first and foremost the window itself. So we need the window size. But if we scale the viewport we scale how large one pixel should be displayed as. So we need to multiply the window size by scale.

Divide the window calculation by 2 to get the center and voila.

So. All in all we are left with this formula:

Code: Select all

Position - (WindowSize * Scale) / 2
FYI. In my setup I move the map by -Position which means I have to add not subtract the window center calculation.