Nikolay Tsenkov

Rotation prop missing on objects loaded from object layer in a tilemap.

Recommended Posts

This is how I load the tilemap, instantiate a background layer and get the object layer for it:

// preload levelgame.load.tilemap( "tilemap", "assets/levels/tilemap.json", null, Phaser.Tilemap.TILED_JSON );game.load.image( "tiles", "assets/levels/tileset.png" );var map = game.add.tilemap( 'tilemap' );map.addTilesetImage('tile-set', 'tiles');// create background layervar layer = map.createLayer( backgroundLayerName );// get objects from the object layervar levelObjects = map.objects[ objectsLayerName ];levelObjects.forEach( function( element ) {    //...} );

I get the position and name properties, but there is no rotation. I've made sure tiliemap.json has the rotation values for every object.

 

I am trying to use the Arcade physics engine, could this be the reason?

 

Thanks.

Share this post


Link to post
Share on other sites

When using arcade physics sprites can still rotate (their collision boxes just can't.)

 

You rotate a phaser sprite via it's "angle" property using degrees (so using values from 0 to 359).

 

Maybe your tilemap properties set rotation (which isn't a sprite property) - this will either create the "rotation" property on the object, but since phaser doesn't know about it, it will not do anything, or it skips setting the property completly, because it isn't available. (Not sure, I think there is a boolean flag to set this behavior.)

 

Anyway: try setting the angle in your tilemap objects.

Share this post


Link to post
Share on other sites

Just went through phaser's code for parsing the tilemap... it doesn't know about the rotation prop:

for (var v = 0, len = json.layers[i].objects.length; v < len; v++)    {        //  Object Tiles        if (json.layers[i].objects[v].gid)        {            var object = {                gid: json.layers[i].objects[v].gid,                name: json.layers[i].objects[v].name,                x: json.layers[i].objects[v].x,                y: json.layers[i].objects[v].y,                visible: json.layers[i].objects[v].visible,                properties: json.layers[i].objects[v].properties            };            objects[json.layers[i].name].push(object);        }        else if (json.layers[i].objects[v].polyline)        {            var object = {                name: json.layers[i].objects[v].name,                type: json.layers[i].objects[v].type,                x: json.layers[i].objects[v].x,                y: json.layers[i].objects[v].y,                width: json.layers[i].objects[v].width,                height: json.layers[i].objects[v].height,                visible: json.layers[i].objects[v].visible,                properties: json.layers[i].objects[v].properties            };            object.polyline = [];            //  Parse the polyline into an array            for (var p = 0; p < json.layers[i].objects[v].polyline.length; p++)            {                object.polyline.push([ json.layers[i].objects[v].polyline[p].x, json.layers[i].objects[v].polyline[p].y ]);            }            collision[json.layers[i].name].push(object);            objects[json.layers[i].name].push(object);        }        // polygon        else if (json.layers[i].objects[v].polygon)        {            var object = slice(json.layers[i].objects[v],                               ["name", "type", "x", "y", "visible", "properties" ]);            //  Parse the polygon into an array            object.polygon = [];            for (var p = 0; p < json.layers[i].objects[v].polygon.length; p++)            {                object.polygon.push([ json.layers[i].objects[v].polygon[p].x, json.layers[i].objects[v].polygon[p].y ]);            }            objects[json.layers[i].name].push(object);        }        // ellipse        else if (json.layers[i].objects[v].ellipse)        {            var object = slice(json.layers[i].objects[v],                               ["name", "type", "ellipse", "x", "y", "width", "height", "visible", "properties" ]);            objects[json.layers[i].name].push(object);        }        // otherwise it's a rectangle        else        {            var object = slice(json.layers[i].objects[v],                               ["name", "type", "x", "y", "width", "height", "visible", "properties" ]);            object.rectangle = true;            objects[json.layers[i].name].push(object);        }    }}

Is there an API in Phaser for accessing the raw son, so I can manually get these rotation props (or probably the entire object group layers)?

Share this post


Link to post
Share on other sites

I've worked around the issue by a custom build step in my games build process (I'm using grunt). What I do is replicate the rotation prop in object.properties.rotation, since phaser successfully copies .properties.

 

To save some time to anyone that might be struggling with this - here is my procedure (read json, edit, replace the file):

var pathUtils = require('path'),    fs = require('fs')// custom tasksgrunt.task.registerTask( "tilemapEdit", "copy the rotation prop of objects", function() {    var path = pathUtils.resolve( __dirname, "src", "game", "assets", "levels", "tilemap.json" );    if ( fs.existsSync( path ) ) {        var jsonText = fs.readFileSync( path, "utf-8" );        if ( jsonText ) {            console.log( "tilemap.json file successfully read." );            try {                var json = JSON.parse( jsonText ),                    layers = json.layers;                console.log( "tilemap.json file successfully parsed." );                if ( layers && layers.length ) {                    layers.forEach( function(layer) {                        if ( layer.type === "objectgroup" ) {                            var objects = layer.objects;                            if ( objects && objects.length ) {                                objects.forEach( function(object) {                                    if ( object.rotation !== undefined ) {                                        if ( !object.properties ) {                                            object.properties = {};                                        }                                        object.properties.rotation = object.rotation;                                    }                                } );                            }                        }                    } );                    var newJsonText = JSON.stringify( json );                    fs.writeFileSync( path, newJsonText );                    console.log( "tilemap.json file successfully updated with rotation props." );                }            } catch(exception) {                console.error( "Error: tilemap.json isn't a valid JSON" );            }        }    } else {        console.error( "Error: tilemap.json file doesn't exist" );    }} );

I will report the issue to the Phaser team.

 

:)

Share this post


Link to post
Share on other sites

Nice workaround.

 

But you are right, phaser should just read in the rotation property from the tiled input.

 

(From the phaser code you posted earlier it does not look that compilcated to do it.)

 

I think you should file a github issue.

Share this post


Link to post
Share on other sites

Just to say that the reason it didn't read the rotation property is because it's a brand new feature in Tiled, and didn't exist with the TilemapParser was coded. However I just added it to dev as a conditional, so it will still load Tiled 0.9 format maps as well as 0.11.

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...

  • Recently Browsing   0 members

    No registered users viewing this page.