Jump to content

Resizing a tiled map in phaser


seekpunk
 Share

Recommended Posts

 
 
var cw = window.innerWidth;            var ch = window.innerHeight;            var game = new Phaser.Game(cw, ch, Phaser.AUTO, 'game', { preload: preload, create: create, update: update });            function preload() {                game.load.tilemap('Background', 'https://gist.githubusercontent.com/anonymous/c61b37df015a0b2af1d7/raw/172bf9c2d4c20c56699eacce263525409caaf743/54996634e4b0a35d00c9b516.json', null, Phaser.Tilemap.TILED_JSON);                game.load.image('tiles', 'http://i.imgur.com/gmWQIFK.png');                game.load.image('player', 'http://i.imgur.com/tCCrLyh.png');            }            var map;            var layer;            var player;            var _keyboard;            var playerJumping;            function create() {                player = game.add.sprite(0, ch - 32, 'player');                game.world.setBounds(0, 0, cw, ch);                game.physics.startSystem(Phaser.Physics.ARCADE);                game.physics.arcade.gravity.y = 300;                game.physics.enable(player, Phaser.Physics.ARCADE);                player.body.collideWorldBounds = true;                game.stage.backgroundColor = '#787878';                map = game.add.tilemap('Background');                map.addTilesetImage('smb_tiles', 'tiles');                layer = map.createLayer('Tile Layer 1');                layer.resizeWorld();                _keyboard = game.input.keyboard.createCursorKeys();                game.camera.follow(player);            }            function update()            {                player.body.x += 2;                if (_keyboard.up.isDown && player.body.onFloor()) {                    playerJumping = true;                    player.body.velocity.y = -2;                }                else {                    playerJumping = false;                }            }<script src="http://yourjavascript.com/222115941388/phaser-min.js"></script>    <div id="game"></div>

 

 

As you can see the tiled Map start at a height of `320px` bcs originally the map have this height  and if I change the game height to `320px` everything works fine , but my question is if i want to make the tiledMap responsive to innerHeight and width for the screen how can i do this so the tiled map start at the bottom of the screen and not at the `320px`

 

 

you can see in the picture bellow how the tiled map layer is starting in the middle of the screen . is there by any chance something i can do to make it start at the bottom of the screen

 

post-10693-0-50962100-1419407779_thumb.p

Link to comment
Share on other sites

 function ScaleGame()        {            game.scale.scaleMode = Phaser.ScaleManager.RESIZE;            game.scale.pageAlignHorizontally = true;            game.scale.pageAlignVertically = true;            game.scale.setScreenSize(true);        }

i made this function and call it at oncreate and it did the job 

Link to comment
Share on other sites

 Share

  • Recently Browsing   0 members

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