Sign in to follow this  
Followers 0
Matheeus

Use Tilemap with Isometric Plugin?

3 posts in this topic

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  
Followers 0

  • Recently Browsing   0 members

    No registered users viewing this page.