Orthogonal map issues

[Jake Cattrall]

This is loaded from a tmx.

Why would this be happening? Promise it's not a tilemap issue, when I resize the browser it changes the way the gaps display.

Thanks.

[Chad Engler]

Can you show me a running example? Generally this happens when the tile offset is incorrect, or scaling is applied incorrectly. It would be much easier to investigate if I could see the code.

Thanks!

[Jake Cattrall]

Thank you: https://github.com/krazyjakee/jQuest

specifically https://github.com/krazyjakee/jQuest/blob/master/init.js and https://github.com/krazyjakee/jQuest/blob/master/js/map.jquest.js

[Chad Engler]

Couple of problems here:

1) You should be using game.resize() not calling the renderer resize method directly.

Change

window.onresize = ->
  game.renderer.resize(window.innerWidth, window.innerHeight)
  Map.center()

to

window.onresize = ->
  game.resize(window.innerWidth, window.innerHeight)
  Map.center()

2. You are way over complicating centering your map

You want to pan using the camera (not the world directly). Camera has a focus method, it would be easier to get the center point of your map, and let the camera focus it for you (also you can use realSize instead of multiplying world size yourself):

var x = Math.floor(world.realSize.x / 2);
    y = Math.floor(world.realSize.y / 2);

//the camera is constrained to the mapsize by default you can
//remove that constraint after creating you game if you want
game.camera.unconstrain();

return game.camera.focus(x, y);

Notice how I floor the values for the position I want to focus, if you set positions to non-integer values then the browser does interpolation that will mess with lining up tiles. Make sure to always have the world be at an integer position.

After those changes it works great, thanks for trying out grapefruit!

[Jake Cattrall]

Thank you very much, never thought that the result would not be an integer.