Jump to content

Legend of Zelda Style maps/scrolling


Reinami
 Share

Recommended Posts

I'm currently working with phaser to create an original Legend of Zelda style RPG game. One of the problems i am coming up with is how to do that map(s). I have been working with Tiled in this case and it seems that i might have a few options.

 

I could make each "screen" be a single "map" within tiled/phaser. It is a separate JSON file and when you move to the edge, the game loads the next screen based on tiles that you have been on. Similar to how this tutorial gets at near the end of it: http://www.gamedevacademy.org/html5-phaser-tutorial-top-down-games-with-tiled/

 

However that seems bad, it seems like it would be hard to keep up which map is going where in the game. So i think what might be best is to simply have the map be one single file, maybe separated if you need to go to a different "area" or a dungeon of sorts. But i am also unsure of how to do that at all. What i am thinking of doing is creating the map as a single file, and have each "screen" be outlined by a special tile that is a trigger that will tell phaser to "scroll/pan" the screen over when you step on it, to be at the next part of the map.

 

Is this a good way of thinking? Is there a tutorial somewhere i can take a quick look at that focuses on phaser/tiled and very large maps?

Is tiled even the best way of doing this? Or should i be looking elsewhere?

 

Thanks in advanced for the help.

Link to comment
Share on other sites

I'm making more of a platformer, but the map-to-map problem is similar: there are some maps where I want the player to walk off the side of the screen and load a new map.

 

I made an object layer named "portals". Every portal has a "level" and a "portal" property. You can specify object properties in Tiled by right-clicking the object in select mode. The level is the name of the level to load for that portal, the "portal" is the name of the portal object in the *next* level to position the player at. When loading the map, I add those objects to a special group called "portals". I check player overlap with that group in my state's update method.

 

There are certain portals that have a property called "touch" with a value of "true".  When the player overlaps one of those, I load the level automatically, no interaction from the player required.

 

For "walk off the side" maps, I have touch portals positioned off the side of the map. Works great.

 

There's no preview of the map, in my game, though -- I just fade out the current level and fade in the new one once it's done getting built/parsed/loaded/whatever.

Link to comment
Share on other sites

If I would make a clone of original Zelda I would make a huge overworld-map in tiled and then one map per dungeon (or just one dungeon-map with all dungeons together as the zelda devs did).

 

As each screen is equal in size I would just check the player position for when to scroll to a new screen, or set bounds to match current room and start scrolling when the player is out of bounds.

 

I think it might be an good idea to use bounds to achieve a nice scrolling effect between screens by tweening the bounds to the new screen (and perhaps tween the player position to walk between the screens). Using bounds it's also easier to prevent stuff in other screens to interfer with the current one.

 

When entering between the overworld and the dungeons I would use an object layer as suggested by drhayes. I would define properties for name and destination. When the area defined by the object is entered it would check coordinates for any object with a name-property matching the current destination-property and then take the player to that position.

Link to comment
Share on other sites

I would have a different tiled file for each map (some might the the size of the screen, some might be bigger). Then have an Object in Tiled that represents a "door" to another map. In Tiled, you can enter object properties:

 

1) target map ID

2) starting position in target map

 

GameState would load only one map at a time and receive the map ID and starting position as a parameter in the init() method.

 

Every time you find one of these "door" objects, it restarts GameState but with the new map and X, Y as parameter (don't forget you should also pass in the player stats, items, etc as well).

 

Btw glad you found my tutorial ;)

Link to comment
Share on other sites

Hey Reinami,

 

Checkout BrowserQuest the map has edges like you describe and is a JSON file (or can be converted cant remember). 

https://github.com/mozilla/BrowserQuest

Its a good map to work off for what you want.

 

Anyway I'd love to see your progress and would be interested in helping if you intend on creating inventory and quest system and perhaps in future multiplayer support.

Link to comment
Share on other sites

If I would make a clone of original Zelda I would make a huge overworld-map in tiled and then one map per dungeon (or just one dungeon-map with all dungeons together as the zelda devs did).

 

As each screen is equal in size I would just check the player position for when to scroll to a new screen, or set bounds to match current room and start scrolling when the player is out of bounds.

 

I think it might be an good idea to use bounds to achieve a nice scrolling effect between screens by tweening the bounds to the new screen (and perhaps tween the player position to walk between the screens). Using bounds it's also easier to prevent stuff in other screens to interfer with the current one.

 

When entering between the overworld and the dungeons I would use an object layer as suggested by drhayes. I would define properties for name and destination. When the area defined by the object is entered it would check coordinates for any object with a name-property matching the current destination-property and then take the player to that position.

 

This sounds like it would be the best option to me. It makes it easier to actually make the maps rather than having these abstract rooms and not knowing exactly how they fit together without some kind of document to show how the maps go together.

 

Are there any good examples of how to set the bounds? The only thing i found was setBounds http://phaser.io/docs/2.4.1/Phaser.World.html#setBounds but that seem set the world bounds? Is that what i am looking for? How does that work with a map extending beyond the world bounds? 

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

    • No registered users viewing this page.
×
×
  • Create New...