"Wrap" tilemap for planet map

[woubuc]

Hi all, I'm new to HTML5 development and game development in general, but I do have a lot of experience with software and web development. Over the past weeks I tried out several frameworks for the game I want to make, and eventually settled on Phaser inside a nw.js window (because Javascript is my favourite language). I made some simple things to learn a bit about Phaser, and today I decided to start working on my real game (a space exploration and crafting game with a classic open world rpg feel - nothing huge, just wanna have fun making it and learning new things).

 

So far in my game I have a 256x256 tilemap which is loaded from a server (dynamic, no preset map), I have a player that can walk around on a grid, and I have a camera following the player. Basic stuff.

 

Now, when my player walks up to the edge of the tilemap, the camera stops following (because it hits the edge of the map) and the player wanders off the screen. Now I was wondering if it was possible to have the world "wrap around" instead of stopping the player at the edge of the map, so that the player could walk off the right edge of the map and end up on the left edge, or walk up off the top of the map and end up on the bottom, with the camera seamlessly following as if the tilemap just continues. Similar to the map in Civilization 5, where you can go around the world either way you like and it just goes on, except my map is just square and not round (or whatever Civ's map is).

 

Is there a way to easily accomplish this using Phaser functionality? I was thinking maybe a way so that the camera could show a part of the view from the other side of the map (maybe using a second camera)? I checked the docs but couldn't find something that would allow for this, and Google didn't have a useful answer either. I could also just duplicate the tilemap when the player gets near the edge, and remove the original one when the player is far enough away from the edge, but I'm worried that this may introduce some memory issues (since the map is quite large and may possibly get even larger). So if anyone has tried / achieved something like this, or has some idea in which direction I could look, I'd really appreciate to hear your thoughts 

 

If you need more information before recommending something, feel free to ask.

[stormwarestudios]

The article I've written on the subject of achieving large-scale tile map operability in browsers should be a starting point for you. Please check it out!

 

In my case, arranging the chunks (see article above for background on this 'chunk' concept) the player sees simplifies the process of facilitating world boundary traversal.

[woubuc]

Thanks, a very interesting read. I hadn't really thought about the chunks concept, in my first tests I just loaded my map data at the start of the game (it's not that large a map and I didn't really consider alternatives yet). But this has definitely set me on the right track for what I want to achieve