Jump to content

Phaser is not loading the same map created in Tiled software


Recommended Posts


I have created a sample map using tiled software. Then tried to load the same u on webpage using phaser.js. But I am not getting the proper result. Is there any mistake in my code or something wrong with library.

<!DOCTYPE html>
      <title>Basic Platformer game</title>
      <meta charset="UTF-8">
      <meta name="viewport" content="width=device-width">
      <script src="js/phaser.min.js"></script>
      <script src="js/phaser.js"></script>
      <div id="phaser-game"></div>
      <script type="text/javascript">
         (function() {

            var game = new Phaser.Game(
            800, 600, Phaser.CANVAS, 'phaser-example', 
            { preload: preload, create: create, update: update, render: render });

            function preload() {
    game.load.tilemap('map', 'background.json', null, Phaser.Tilemap.TILED_JSON);
    game.load.image('tile2', 'floor2.png');


var map;
var layer;
var marker;
var player;
var currentTile;
var cursors;
var curser;

function create() {
    game.stage.backgroundColor = '#787878';    

    map = game.add.tilemap('map');

    currentTile = map.getTile(0, 0);
    layer = map.createLayer('Tile Layer 1');

    player = game.add.sprite(20, 20, 'player');
    player.body.fixedRotation = true;

    marker = game.add.graphics();
    marker.lineStyle(2, 0x000000, 1);
    marker.drawRect(0, 0, 20, 20);

    cursors = game.input.keyboard.createCursorKeys();    
    game.camera.follow(player, Phaser.Camera.FOLLOW_LOCKON, 0.1, 0.1);





Link to comment
Share on other sites


  • Recently Browsing   0 members

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