Sign in to follow this  
Matheeus

Use Tilemap with Isometric Plugin?

Recommended Posts

Hi,

I'm new with Phaser and this plugin, I'm actually exploring his possibility.

I'm planning to make an isometric MMO in HTML5, and I need to make "spaces" that aren't only squares or rectangles, but also their composition, something like this:

e11ee0f791b8fe111284d9fd6b6d1d85.png

with a tileMap like this:

      var tileMap = [
        [t1, t1, t1, t1, t1],
        [t1, t1, t1, t1, t1],
        [t1, t1, t1, t1, t1],
        [t1, t1, t1, t1, t1],
        [t1, t1, t1, t1, t1],
        [0, t1, t1, t1, 0],
        [0, t1, t1, t1, 0],
        [t1, t1, t1, t1, t1],
        [t1, t1, t1, t1, t1],
        [t1, t1, t1, t1, t1],
        [t1, t1, t1, t1, t1],
        [t1, t1, t1, t1, t1]
      ]

Is this possible with the Phaser's Isometric plugin? Someone already achieved this?

Share this post


Link to post
Share on other sites

I use the program "Tiled". After creating a scene, save as orthogonal and change the width of the Map in Tiled to 32.

Use Phaser and Isometric plug in to load the map.

I create a function to walk through JSON file and load the layers.


function buildMapIso (map, witchTileset, witchLayer, deltaX, deltaY,
                     imageLoaded, group, game, collide) {
     Var deltaTileIndex = map.tilesets [witchTileset] .firstgid;
     Var mapColls = map.layers[wichLayer].width;
     Var mapRows = map.layers[wichLayer].height;
     Para (var coll = 0; coll <mapColls; coll ++) {
         Para (var row = 0; row <mapRows; row ++) {
            
             If (mapa.hasTile (coll, row, witchLayer)) {

                var tile = map.getTile( coll, row, witchLayer);
                
                var witchSprite = tile.index - deltaTileIndex;
                
                posX = coll * mapWidth; 
                posY = row * mapHeight; 
                
                var theSprite = jogo.add.isoSprite(posX, posY, 0, 
                                            imageLoaded, 
                                            witchSprite , 
                                            group); 

                game.physics.isoArcade.enable( theSprite);                
                if( collide ){
                    theSprite.body.collideWorldBounds = true;
                }

                theSprite.body.immovable = true;
                theSprite.anchor.set(0.5);

             }
         }
     }
}

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.