How to set sprite's position based on the position of the object from Tiled Map Editor?

[alriano]

i want to add empty rectangle object in the map with Tiled then place sprite based on the rectangle object's position with Phaser, like coins, stars or maybe animated sprite, how to do this?
or can someone please share the source code of the game that use Tiled map?
i'm using Phaser version 1.0.5 right now

[Mike]

Hi, I'm not quite sure what you mean by:

 

"i want to add empty rectangle object in the map with Tiled "

 

But what I understand is that you want to make a tilemap and then put some object/sprites so you can check:

examples/tilemaps/mapcollide.php

 

and this:

 

map.setCollisionRange(80, 97, true, true, true, true);      

 

map.setCollisionRange(15, 17, true, true, false, true);

[alriano]

i'm sorry for the confusion, i'm not very good at english
what i meant by empty rectangle object is like this http://farm3.staticflickr.com/2873/9902671653_2b94957ae7_b.jpg
what i want is to get the position of that rectangle object and then place the coin sprite

[Mike]

Well so you can try something like this:

 

rectange.x = 200;

rectangle.y = 200;

 

coin.x = rectangle.x + 100;

coin.y = rectangle.y + 100;

 

and then the coin will be at world 300,300

 

isn't it ok ? or maybe there is more logic that you want to support ?

[Hsaka]

Hello, I'm not sure if there's a built-in way to do that. Here's a slightly modified tilemap example which might be useful:

<script type="text/javascript">(function () {    var game = new Phaser.Game(800, 600, Phaser.AUTO, '', { preload: preload, create: create, update: update, render: render });    function preload() {        game.load.tilemap('background', 'assets/maps/smb_bg.png', 'assets/maps/smb_bg.json', null, Phaser.Tilemap.JSON);        game.load.tilemap('level1', 'assets/maps/smb_tiles.png', 'assets/maps/smb_level1.json', null, Phaser.Tilemap.JSON);        game.load.image('ball', 'assets/aqua_ball.png');    }    function create() {        game.stage.backgroundColor = '#787878';        game.add.tilemap(0, 0, 'background');        var map = game.add.tilemap(0, 0, 'level1');                var spr = game.add.sprite(0, 0, 'ball');        for (var y = 0; y < map.currentLayer.mapData.length; y++) {            for (var x = 0; x < map.currentLayer.mapData[y].length; x++) {                var tileIndex = map.currentLayer.getTileIndex(x, y);                switch (tileIndex) {                    case 2:   //whatever the index of your marker rectangle is                        spr.x = x * map.currentLayer.tileWidth;                        spr.y = y * map.currentLayer.tileHeight;                        break;                }            }        }    }    function update() {        if (game.input.keyboard.isDown(Phaser.Keyboard.LEFT))        {            game.camera.x -= 8;        }        else if (game.input.keyboard.isDown(Phaser.Keyboard.RIGHT))        {            game.camera.x += 8;        }        if (game.input.keyboard.isDown(Phaser.Keyboard.UP))        {            game.camera.y -= 8;        }        else if (game.input.keyboard.isDown(Phaser.Keyboard.DOWN))        {            game.camera.y += 8;        }    }    function render() {    }})();</script>