You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I have the following Tiled tilemap with a tile layer named Bg and 3 object layers named NPC, Obj, and Player respectively
I can load the tile map layer but not the object layers. I'd like to start by loading the player, but when I try to do so I get a sprite placeholder like below:
Here's all the things I tried to create a player. map.createLayer failed because of an invalid layer id (I assume the reason for this is that object layers function differently), using .createFromObjects would always result in a null instance of data, and so getData would return null and nothing for my player would load and retrieving the layer and then the player object doesn't load the sprite either...
import{Player}from"../objects/player";import{createInteractables,addInteractableasaddInteractables,Interactable,}from"../objects/interactables";import{ASSETS,ASSETPATH}from"./constants";import{CustomScene}from"../objects/scene";import{initializeKeysasinitializeInputs}from"../utils/inputs";import{initializePlugins}from"../utils/plugins";importMergedInputfrom"phaser3-merged-input";import{createWindow}from"../objects/dialog";import{Character}from"../objects/character";importconvertToInteractfrom"../utils/convertToInteract";exportdefaultclassHomeextendsPhaser.SceneimplementsCustomScene{constructor(){super({key: "Home"});}// Class variables// Loading everything is not a bad idea at first;// I can remove what I don't end up usingmergedInput!: MergedInput;player!: Player;isPaused: boolean=false;preload(){// Load pluginsinitializePlugins(this);// Load the tilesetsthis.load.image("house_tiles","/tiles/house.png");this.load.image("house_big_tiles","/tiles/house_big.png");this.load.image("player_tiles","/tiles/player.png");this.load.image("npc1_tiles","/tiles/npc1.png");this.load.image("npc2_tiles","/tiles/npc2.png");this.load.image("npc3_tiles","/tiles/npc3.png");this.load.image("npc4_tiles","/tiles/npc4.png");this.load.image("npc5_tiles","/tiles/npc5.png");// Load the map jsonthis.load.tilemapTiledJSON("tilemap","/tiles/map.json");}create(){// Initialize scene.mergedInputinitializeInputs(this,0);// Test load images// this.add.image(0, 0, "house_tiles");// this.add.image(0, 0, "house_big_tiles");// this.add.image(0, 0, "player_tiles");// this.add.image(0, 0, "npc1_tiles");// this.add.image(0, 0, "npc2_tiles");// this.add.image(0, 0, "npc3_tiles");// this.add.image(0, 0, "npc4_tiles");// this.add.image(0, 0, "npc5_tiles");// Create the tilemapconstmap=this.make.tilemap({key: "tilemap",});// Add the tileset imagesconsthouse_tiles=map.addTilesetImage("house","house_tiles");consthouse_big_tiles=map.addTilesetImage("house_big","house_big_tiles");constplayer=map.addTilesetImage("player","player_tiles");constnpc1Tileset=map.addTilesetImage("npc1","npc1_tiles");constnpc2Tileset=map.addTilesetImage("npc2","npc2_tiles");constnpc3Tileset=map.addTilesetImage("npc3","npc3_tiles");constnpc4Tileset=map.addTilesetImage("npc4","npc4_tiles");constnpc5Tileset=map.addTilesetImage("npc5","npc5_tiles");// Create the bg layer in the correct orderconstbgLayer=map.createLayer("Bg",house_tiles!)!;// Bg layerbgLayer.setDepth(0);/* // Create collision groups const objectGroup = this.physics.add.group(); const npcGroup = this.physics.add.group(); const playerGroup = this.physics.add.group(); // Retrieve npc objects const npcs: Character[] = map .createFromObjects("NPC", [ { name: "NPC1", scene: this, key: "npc1", classType: Character, }, { name: "NPC2", scene: this, key: "npc2", classType: Character, }, { name: "NPC3", scene: this, key: "npc3", classType: Character, }, { name: "NPC4", scene: this, key: "npc4", classType: Character, }, { name: "NPC5", scene: this, key: "npc5", classType: Character, }, ]) .map((object) => { return new Character( this, object.getData("x"), object.getData("y"), object.name, convertToInteract(object.getData("interact")), object.getData("solid") ?? null, object.getData("audio") ?? null, object.getData("sprite") ?? null, object.getData("path") ?? null ); }); // Retrieve obj objects const objects: Interactable[] = map .createFromObjects("Obj", [ { name: "Trumpet", scene: this, key: "trumpet", classType: Interactable, }, { name: "Electrowave", scene: this, key: "electrowave", classType: Interactable, }, { name: "Book1", scene: this, key: "book1", classType: Interactable, }, { name: "Book2", scene: this, key: "book2", classType: Interactable, }, { name: "Book3", scene: this, key: "book3", classType: Interactable, }, { name: "Book4", scene: this, key: "book4", classType: Interactable, }, { name: "Book5", scene: this, key: "book5", classType: Interactable, }, { name: "Book6", scene: this, key: "book6", classType: Interactable, }, { name: "SoccerPile", scene: this, key: "soccerPile", classType: Interactable, }, { name: "BasketballPile", scene: this, key: "basketballpile", classType: Interactable, }, { name: "ShoeR", scene: this, key: "shoer", classType: Interactable, }, { name: "ShoeL", scene: this, key: "shoel", classType: Interactable, }, { name: "Switch", scene: this, key: "switch", classType: Interactable, }, { name: "Xbox", scene: this, key: "xbox", classType: Interactable, }, { name: "Plant1", scene: this, key: "plant1", classType: Interactable, }, { name: "Plant2", scene: this, key: "plant2", classType: Interactable, }, { name: "Phone1", scene: this, key: "phone1", classType: Interactable, }, { name: "Phone2", scene: this, key: "phone2", classType: Interactable, }, { name: "Piano", scene: this, key: "piano", classType: Interactable, }, { name: "Table1", scene: this, key: "table1", classType: Interactable, }, { name: "Table2", scene: this, key: "table2", classType: Interactable, }, { name: "Table3", scene: this, key: "table3", classType: Interactable, }, { name: "Shelf1", scene: this, key: "shelf1", classType: Interactable, }, { name: "Shelf2", scene: this, key: "shelf2", classType: Interactable, }, { name: "Shelf3", scene: this, key: "shelf3", classType: Interactable, }, { name: "Shelf4", scene: this, key: "shelf4", classType: Interactable, }, { name: "TV1", scene: this, key: "tv1", classType: Interactable, }, { name: "TV2", scene: this, key: "tv2", classType: Interactable, }, { name: "TV3", scene: this, key: "tv3", classType: Interactable, }, { name: "Computer1", scene: this, key: "computer1", classType: Interactable, }, { name: "Computer2", scene: this, key: "computer2", classType: Interactable, }, { name: "Computer3", scene: this, key: "computer3", classType: Interactable, }, { name: "ProgrammingLanguages", scene: this, key: "programminglanguages", classType: Interactable, }, ]) .map((object) => { return new Interactable( this, object.getData("x"), object.getData("y"), object.name, convertToInteract(object.getData("interact")), object.getData("solid") ?? null, object.getData("audio") ?? null, object.getData("sprite") ?? null ); }); // Once I have my list of objects and characters, // where do I go from there? // GOALS // - Render objects and characters (why don't they render) // - Add collision to objects and characters // I should be able to handle it all in one... // I need to give consideration to grid engine and how it will tie my project together npcs.forEach((npc) => { // TODO console.log(npc); // this.add.image(npc.x, npc.y, npc.name); - How can I add images? Not sure yet... }); objects.forEach((object) => { // TODO console.log(object); }); */// Create the player// Interesting... data is null// TODO: https://github.com/photonstorm/phaser/issues/6272this.player=map.createFromObjects("Player",{name: "Player",scene: this,key: "player",}).map((object)=>{console.log(object);returnnewPlayer(this,object.getData("x"),object.getData("y"),object.name,{up: false,down: true,left: false,right: false,});}).at(0)!;constplayerLayer=map.getObjectLayer("Player");constplayerData=playerLayer?.objects.at(0)!;map.createLayer("Player","player_tiles");this.player=newPlayer(this,playerData.x??0,playerData.y??0,playerData.name,{up: false,down: true,left: false,right: false,});}update(delta: any){// Check if the player is currently colliding or overlapping with any interactable objects// this.player.updatePlayer(this.game); // Updates the player for the scene, pausing if the player interacts with an object}}
And map.json at the end for good measure:
{ "compressionlevel":-1,
"height":10,
"infinite":false,
"layers":[
{
"compression":"",
"data":"QgAAAEIAAABCAAAAQgAAAEIAAABCAAAAOwAAADsAAAA7AAAAQwAAAEMAAABDAAAAQwAAAEMAAABDAAAAQgAAAEIAAABCAAAAQgAAAEIAAABCAAAAOwAAADsAAAA7AAAAQwAAAEMAAABDAAAAQwAAAEMAAABDAAAAQgAAAEIAAABCAAAAQgAAAEIAAABCAAAAOwAAADsAAAA7AAAAQwAAAEMAAABDAAAAQwAAAEMAAABDAAAARQAAAEUAAABFAAAARQAAAEUAAABFAAAAOwAAADsAAAA7AAAARAAAAEQAAABEAAAARAAAAEQAAABEAAAARQAAAEUAAABFAAAARQAAAEUAAABFAAAAOwAAADsAAAA7AAAARAAAAEQAAABEAAAARAAAAEQAAABEAAAARQAAAEUAAABFAAAARQAAAEUAAABFAAAAOwAAADsAAAA7AAAARAAAAEQAAABEAAAARAAAAEQAAABEAAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAOwAAADsAAAA7AAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAOwAAADsAAAA7AAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAOwAAADsAAAA7AAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAAOwAAADsAAAA7AAAAQQAAAEEAAABBAAAAQQAAAEEAAABBAAAA",
"encoding":"base64",
"height":10,
"id":1,
"name":"Bg",
"opacity":1,
"type":"tilelayer",
"visible":true,
"width":15,
"x":0,
"y":0
},
{
"draworder":"topdown",
"id":4,
"name":"Obj",
"objects":[
{
"gid":2,
"height":64,
"id":34,
"name":"Piano",
"properties":[
{
"name":"interact",
"type":"string",
"value":""
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":-92,
"y":57
},
{
"gid":4,
"height":64,
"id":35,
"name":"Table1",
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":-31.3864,
"y":63.3864
},
{
"gid":39,
"height":32,
"id":45,
"name":"Trumpet",
"properties":[
{
"name":"audio",
"type":"string",
"value":"\/audio\/tpt.mp3"
},
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Now's your chance, don't blow it!\",\n\"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n\"text\": \"\ud83c\udfb5\",\n\"choices\": [\n { \"index\": 2, \"text\": null }\n ]\n },\n 2: {\n\"text\": \"You're now an accomplished trumpet player\",\n\"choices\": []\n }\n}\n"
}],
"rotation":90,
"type":"Interactable",
"visible":true,
"width":32,
"x":-29.3105727272727,
"y":0.00760909090909223
},
{
"gid":5,
"height":64,
"id":73,
"name":"Shelf4",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Say! What a lot of books there are\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":321.375,
"y":58.2917
},
{
"gid":5,
"height":64,
"id":49,
"name":"Shelf3",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"This one has 5 stars. This one has memoirs.\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":279.625,
"y":58.25
},
{
"gid":5,
"height":64,
"id":48,
"name":"Shelf2",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"On-time book, overdue book, old book, new book\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":237.875,
"y":58.375
},
{
"gid":5,
"height":64,
"id":46,
"name":"Shelf1",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"One book, two book, red book, blue book\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":196.5,
"y":58.3333
},
{
"gid":17,
"height":32,
"id":58,
"name":"Book4",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Success is not delivering a feature; success is learning how to solve the customer\u2019s problem.\" - The Lean Startup\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":90,
"type":"Interactable",
"visible":true,
"width":32,
"x":285.136,
"y":77
},
{
"gid":17,
"height":32,
"id":74,
"name":"Book6",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Is there intelligence without life? Is there mind without communication? Is there language without living? Is there thought without experience?\" - Alan Turing: The Enigma\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":362.333,
"y":105.167
},
{
"gid":17,
"height":32,
"id":59,
"name":"Book5",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"But until a person can say deeply and honestly, \"I am what I am today because of the choices I made yesterday,\" that person cannot say, \"I choose otherwise.\" - The Seven Habits of Highly Effective People\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":90,
"type":"Interactable",
"visible":true,
"width":32,
"x":310.636,
"y":62.2727
},
{
"gid":17,
"height":32,
"id":57,
"name":"Book3",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"The world was to me a secret which I desired to divine.\" - Frankenstein\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":271.5,
"y":96
},
{
"gid":17,
"height":32,
"id":60,
"name":"Book2",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"A book has been taken. A book has been taken? You summoned the Watch,\" Carrot drew himself up proudly, \"because someone's taken a book? You think that's worse than murder?\" - Guards Guards\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":90,
"type":"Interactable",
"visible":true,
"width":32,
"x":226.75,
"y":72
},
{
"gid":17,
"height":32,
"id":56,
"name":"Book1",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"\\\"42: the answer to life, the universe, and everything\\\" - The Hitchhiker's Guide to the Galaxy\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":90,
"type":"Interactable",
"visible":true,
"width":32,
"x":194.591,
"y":62.0909
},
{
"gid":25,
"height":32,
"id":62,
"name":"Plant1",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Don't mind me, I'm just hanging out with my buddy, yellow\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":95.5,
"y":316.75
},
{
"gid":26,
"height":32,
"id":63,
"name":"Plant2",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Don't mind me, I'm just hanging out with my buddy, green\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":162.333,
"y":317.167
},
{
"gid":18,
"height":32,
"id":75,
"name":"Electrowave",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"It appears to be a shameless plug for youtube.com\/@electrowav\"\n\"choices\": []\n }\n}"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":32.25,
"y":32.1667
},
{
"gid":7,
"height":64,
"id":76,
"name":"Computer1",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"A blank text document is open on the screen\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":-92.5,
"y":255.667
},
{
"gid":7,
"height":64,
"id":77,
"name":"Computer2",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n \"text\": \"Welcome to XanderGPT, your one stop shop for any and all questions about Xander's web and software portfolio!\",\n \"choices\": [\n { \"text\": \"software development\", \"index\": 1 },\n { \"text\": \"web development\", \"index\": 2 },\n { \"text\": \"future projects\", \"index\": 3 }\n ]\n },\n 1: {\n \"text\": \"Xander's made a lot of software, from a Python library for detecting features of phishing websites to a code ast parser for generating documentation comments. You can see all his projects at https:\/\/github.com\/xanmankey?tab=repositories\",\n \"choices\": []\n },\n 2: {\n \"text\": \"Xander's made a couple websites, such as Banana Economic$, a banana economy with simulated investing and Phish AI for automating the scanning of features. Currently, Xander is experimenting with the React framework to improve this project\",\n \"choices\": []\n },\n 3: {\n \"text\": \"Xander has a number of future projects he's looking forward to tackle, for example the integration of editing templates into the popular python library, moviepy\",\n \"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":-31,
"y":256.667
},
{
"gid":7,
"height":64,
"id":78,
"name":"Computer3",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"It's a computer; power it on?\",\n\"choices\": [\n { \"index\": 1, \"text\": \"yes\" },\n { \"index\": 0, \"text\": \"no\" }\n ]\n },\n 1: {\n\"text\": \"It's a GRUB menu; what do you want to boot?\",\n\"choices\": [\n { \"index\": 2, \"text\": \"Windows\" },\n { \"index\": 3, \"text\": \"Ubuntu\" }\n ]\n },\n 2: {\n\"text\": \"It's a blue screen; you don't appear to be able to do anything else\",\n\"choices\": [\n { \"index\": 4, \"text\": null }\n ]\n },\n 3: {\n\"text\": \"There's an error message that says 'Failed to mount the real root device. Bailing out, you are on your own. Good luck'\",\n\"choices\": [\n { \"index\": 4, \"text\": null }\n ]\n },\n 4: {\n\"text\": \"You didn't really want to use the computer anyway\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":28,
"y":257.167
},
{
"gid":9,
"height":64,
"id":80,
"name":"ProgrammingLanguages",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"It's a logical carpet\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":320,
"y":320.03
},
{
"gid":4,
"height":64,
"id":83,
"name":"Table2",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"The phone is open to an app called TODO. It appears to be a TODO list app.\",\n\"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n\"text\": \"Ironically, it is finished\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":202.5,
"y":246.667
},
{
"gid":4,
"height":64,
"id":84,
"name":"Table3",
"properties":[
{
"name":"child",
"type":"object",
"value":87
},
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"The phone appears to be open to an app called SwipeSwap\",\n\"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n\"text\": \"The phone is no longer open to an app called SwipeSwap; it appears to have crashed\",\n\"choices\": [\n { \"index\": 2, \"text\": null }\n ]\n },\n 2: {\n\"text\": \"Now the phone is bricked\",\n\"choices\": [\n { \"index\": 3, \"text\": null }\n ]\n },\n 3: {\n\"text\": \"It's a brick\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":303.5,
"y":247.667
},
{
"gid":38,
"height":32,
"id":85,
"name":"Phone1",
"properties":[
{
"name":"interact",
"type":"string",
"value":""
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":219,
"y":223.667
},
{
"gid":38,
"height":32,
"id":87,
"name":"Phone2",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"The phone appears to be open to an app called SwipeSwap\",\n\"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n\"text\": \"The phone is no longer open to an app called SwipeSwap; it appears to have crashed\",\n\"choices\": [\n { \"index\": 2, \"text\": null }\n ]\n },\n 2: {\n\"text\": \"Now the phone is bricked\",\n\"choices\": [\n { \"index\": 3, \"text\": null }\n ]\n },\n 3: {\n\"text\": \"It's a brick\",\n\"choices\": []\n }\n}\n"
},
{
"name":"sprite",
"type":"string",
"value":"brick??????? How can I load a specific sprite?"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":324.227,
"y":223.894
},
{
"gid":6,
"height":64,
"id":88,
"name":"TV1",
"properties":[
{
"name":"audio",
"type":"string",
"value":"\/audio\/undertale.mp3"
},
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"\ud83c\udfb5\",\n\"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n\"text\": \"You are filled with determination\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":190,
"y":145.167
},
{
"gid":6,
"height":64,
"id":92,
"name":"TV2",
"properties":[
{
"name":"audio",
"type":"string",
"value":"\/audio\/undertale.mp3"
},
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"\ud83c\udfb5\",\n\"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n\"text\": \"Cubes have never been so much fun\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":256.25,
"y":145.667
},
{
"gid":6,
"height":64,
"id":93,
"name":"TV3",
"properties":[
{
"name":"interact",
"type":"string",
"value":""
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":64,
"x":323.5,
"y":146.667
},
{
"gid":37,
"height":32,
"id":94,
"name":"Switch",
"properties":[
{
"name":"audio",
"type":"string",
"value":"\/audio\/botw.mp3"
},
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"It's a game console; turn it on? (y\/n)\",\n\"choices\": [\n { \"index\": 1, \"text\": \"y\" },\n { \"index\": 0, \"text\": \"n\" }\n ]\n },\n 1: {\n\"text\": \"\ud83c\udfb5\",\n\"choices\": [\n { \"index\": 2, \"text\": null }\n ]\n },\n 2: {\n\"text\": \"It's your favorite, The Legend of Zeldo: Smell of the Forest!\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":25,
"type":"Interactable",
"visible":true,
"width":32,
"x":204.75,
"y":175.167
},
{
"gid":36,
"height":32,
"id":95,
"name":"Xbox",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Xbox: It's a controller... kind of. The buttons are all swapped...\",\n\"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n\"text\": \"What kind of person thought that this would be a good idea?\",\n\"choices\": []\n }\n}\n"
},
{
"name":"solid",
"type":"bool",
"value":false
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":283.75,
"y":183.167
},
{
"gid":29,
"height":32,
"id":163,
"name":"ShoeL",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"All of a sudden you feel as though you're looking at a pair of shoes.\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"",
"visible":true,
"width":32,
"x":-82.5,
"y":144.152
},
{
"gid":21,
"height":32,
"id":164,
"name":"ShoeR",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"All of a sudden you feel as though you're looking at a pair of shoes.\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"",
"visible":true,
"width":32,
"x":-82.5,
"y":135.167
},
{
"height":0,
"id":167,
"name":"NPC4Spot1",
"point":true,
"rotation":0,
"type":"",
"visible":true,
"width":0,
"x":-69.1667,
"y":174.667
},
{
"gid":47,
"height":32,
"id":175,
"name":"SoccerPile",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"All of a sudden you feel as though you want to kick something.\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":-5.75,
"y":147.167
},
{
"gid":48,
"height":32,
"id":176,
"name":"BasketballPile",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"All of a sudden you feel as though you want to throw something.\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Interactable",
"visible":true,
"width":32,
"x":51.5,
"y":147.833
},
{
"height":0,
"id":179,
"name":"NPC4Spot2",
"point":true,
"rotation":0,
"type":"",
"visible":true,
"width":0,
"x":49,
"y":177.167
},
{
"gid":55,
"height":32,
"id":190,
"name":"",
"properties":[
{
"name":"audio",
"type":"string",
"value":"\/audio\/flute.mp3"
},
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Now's your chance, don't blow it!\",\n\"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n\"text\": \"\ud83c\udfb5\",\n\"choices\": [\n { \"index\": 2, \"text\": null }\n ]\n },\n 2: {\n\"text\": \"You're now an accomplished flute player\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"",
"visible":true,
"width":32,
"x":-2.25,
"y":32.5
},
{
"gid":84,
"height":48,
"id":236,
"name":"NPC1",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n \"text\": \"Hey there! I've been reading about Xander's experience with app development, do you want to hear? (options: TODO, SwipeSwap, tech stack)\",\n \"choices\": [\n { \"index\": 1, \"text\": \"TODO\" },\n { \"index\": 2, \"text\": \"SwipeSwap\" },\n { \"index\": 3, \"text\": \"Tech Stack\" }\n ]\n },\n 1: {\n \"text\": \"TODO was Xander's first published app. It was also his experience using both flutter and django, so it was quite the experience\",\n \"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n },\n 2: {\n \"text\": \"Xander is currently working on SwipeSwap in a team of 4 right now. The app appears promising, but it remains to be seen as to whether it will be finished and published or not\",\n \"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n },\n 3: {\n \"text\": \"Xander mostly uses flutter for his frontends and has a little experience with Django and lately Firebase for backends. He's always on the lookout for the next thing though, as he enjoys learning new tools!\",\n \"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n }\n}\n"
}],
"rotation":0,
"type":"Character",
"visible":true,
"width":48,
"x":271,
"y":250
},
{
"gid":101,
"height":48,
"id":237,
"name":"NPC2",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Can't talk, too busy working on XanderGPT over here\",\n\"choices\": []\n }\n}\n"
}],
"rotation":0,
"type":"Character",
"visible":true,
"width":48,
"x":-63,
"y":267.5
},
{
"gid":125,
"height":48,
"id":238,
"name":"NPC3",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n \"text\": \"What do you want kid? I'm busy gaming right now (favorite games?, controller?, game development?)\",\n \"choices\": [\n { \"index\": 1, \"text\": \"favorite games\" },\n { \"index\": 2, \"text\": \"controller\" },\n { \"index\": 3, \"text\": \"game development\" }\n ]\n },\n 1: {\n \"text\": \"Xander really seems to like BOTW, Minecraft, and Undertale, but he plays all sorts of things. Lately, I've seen him playing Cuphead and Hollow Knight, and I've heard he wants to pick up Celeste.\",\n \"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n },\n 2: {\n \"text\": \"Yeah, Xander doesn't always play video games correctly; in fact, he wrote software, A Different Way to Play, to mess up your controls and force you to experience games in a new way!\",\n \"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n },\n 3: {\n \"text\": \"Xander's done a little game development (keyword being 'a little' if you couldn't tell). Before this, he made the game Medical Bill$, which is a 2D escape room where you try to escape the hospital before you can get saddled with absurd healthcare expenses.\",\n \"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n }\n}\n"
}],
"rotation":0,
"type":"Character",
"visible":true,
"width":48,
"x":358,
"y":165.5
},
{
"gid":149,
"height":48,
"id":239,
"name":"NPC4",
"properties":[
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n\"text\": \"Don't mind me, I'm training to beat Xander in a race\",\n\"choices\": [\n { \"index\": 1, \"text\": \"basketballs?\" },\n { \"index\": 2, \"text\": \"soccer balls?\" },\n { \"index\": 3, \"text\": \"shoes?\" }\n ]\n },\n 1: {\n\"text\": \"Make sure to challenge Xander to a 3-point contest; he plays center\",\n\"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n },\n 2: {\n\"text\": \"If you see Xander on defense, make sure to go the other direction\",\n\"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n },\n 3: {\n\"text\": \"Xander's PR's are currently at:\\n3 Mile: 17:42\\nMile: 4:52\\n800m: 2:06\\n400m: 53\\nIf I keep training, I think I can beat them!\",\n\"choices\": [\n { \"index\": 0, \"text\": null }\n ]\n }\n}\n"
}],
"rotation":0,
"type":"Character",
"visible":true,
"width":48,
"x":-83.5,
"y":188.5
},
{
"gid":161,
"height":48,
"id":240,
"name":"NPC5",
"properties":[
{
"name":"audio",
"type":"string",
"value":"\/audio\/chopsticks.mp3"
},
{
"name":"interact",
"type":"string",
"value":"{\n 0: {\n \"text\": \"\ud83c\udfb5\",\n \"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 1: {\n \"text\": \"I'm one of Xander's 5 Bandcamp followers; I can tell you anything you need to know about his musical career. What do you want to know?\",\n \"choices\": [\n { \"index\": 2, \"text\": \"Instruments\" },\n { \"index\": 3, \"text\": \"Jazz\" },\n { \"index\": 4, \"text\": \"Electronic\" }\n ]\n },\n 2: {\n \"text\": \"Alright, here we go... piano, trumpet, flute, drums, saxophone (kind of), guitar (kind of)\",\n \"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 3: {\n \"text\": \"Xander's a cool cat, doing jazz arrangements and improvisation in his free time\",\n \"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n },\n 4: {\n \"text\": \"Electronic genres like synthwave and EDM were where Xander got his start; shocking!\",\n \"choices\": [\n { \"index\": 1, \"text\": null }\n ]\n }\n}\n"
}],
"rotation":0,
"type":"Character",
"visible":true,
"width":48,
"x":-60.5,
"y":58.5
}],
"offsetx":96,
"offsety":0,
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
},
{
"draworder":"topdown",
"id":7,
"name":"NPC",
"objects":[],
"offsetx":-43.5,
"offsety":-22.5,
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
},
{
"draworder":"topdown",
"id":8,
"name":"Player",
"objects":[
{
"gid":183,
"height":48,
"id":241,
"name":"Player",
"rotation":0,
"type":"Player",
"visible":true,
"width":48,
"x":238.5,
"y":286.5
}],
"offsetx":-14.5,
"offsety":1.5,
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}],
"nextlayerid":14,
"nextobjectid":243,
"orientation":"orthogonal",
"renderorder":"right-down",
"tiledversion":"1.10.2",
"tileheight":32,
"tilesets":[
{
"columns":4,
"firstgid":1,
"image":"house_big.png",
"imageheight":256,
"imagewidth":256,
"margin":0,
"name":"house_big",
"spacing":0,
"tilecount":16,
"tileheight":64,
"tiles":[
{
"id":1,
"objectgroup":
{
"draworder":"index",
"id":2,
"name":"",
"objects":[
{
"height":9.90909,
"id":1,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":7.36364,
"x":12.9091,
"y":44.1818
},
{
"height":56.7273,
"id":3,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":57,
"x":4.09091,
"y":7
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":3,
"objectgroup":
{
"draworder":"index",
"id":2,
"name":"",
"objects":[
{
"height":32.0909,
"id":1,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":51.9091,
"x":8.18182,
"y":32
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":4,
"objectgroup":
{
"draworder":"index",
"id":2,
"name":"",
"objects":[
{
"height":49,
"id":1,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":41.5455,
"x":11.2727,
"y":10.1818
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":5,
"objectgroup":
{
"draworder":"index",
"id":2,
"name":"",
"objects":[
{
"height":40,
"id":1,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":57.7273,
"x":3.18182,
"y":12.7273
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":6,
"objectgroup":
{
"draworder":"index",
"id":3,
"name":"",
"objects":[
{
"height":49.8182,
"id":2,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":45.8182,
"x":9.09091,
"y":8.09091
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
}],
"tilewidth":64,
"transparentcolor":"#ff00ff"
},
{
"columns":8,
"firstgid":17,
"image":"house.png",
"imageheight":256,
"imagewidth":256,
"margin":0,
"name":"house",
"spacing":0,
"tilecount":64,
"tileheight":32,
"tiles":[
{
"id":0,
"objectgroup":
{
"draworder":"index",
"id":2,
"name":"",
"objects":[
{
"height":11.7812,
"id":1,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":9.78999,
"x":2.07415,
"y":2.15712
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":5,
"objectgroup":
{
"draworder":"index",
"id":4,
"name":"",
"objects":[
{
"ellipse":true,
"height":14.7273,
"id":4,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":15.5455,
"x":0.272727,
"y":0.818182
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":6,
"objectgroup":
{
"draworder":"index",
"id":2,
"name":"",
"objects":[
{
"ellipse":true,
"height":14.7273,
"id":1,
"name":"",
"rotation":0,
"type":"",
"visible":true,
"width":15.5455,
"x":0.22725,
"y":1.1818
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":8,
"objectgroup":
{
"draworder":"index",
"id":2,
"name":"",
"objects":[
{
"height":0,
"id":1,
"name":"",
"polygon":[
{
"x":0,
"y":0
},
{
"x":-5.18182,
"y":-16.1818
},
{
"x":12.6364,
"y":-15.8182
},
{
"x":7.63636,
"y":-0.272727
}],
"rotation":0,
"type":"",
"visible":true,
"width":0,
"x":12.2727,
"y":32.0909
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":9,
"objectgroup":
{
"draworder":"index",
"id":3,
"name":"",
"objects":[
{
"height":0,
"id":2,
"name":"",
"polygon":[
{
"x":0,
"y":0
},
{
"x":-5.90909,
"y":-16.4545
},
{
"x":11.9091,
"y":-16.3636
},
{
"x":7.36364,
"y":0.272727
}],
"rotation":0,
"type":"",
"visible":true,
"width":0,
"x":12.4545,
"y":32.0909
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
},
{
"id":12,
"objectgroup":
{
"draworder":"index",
"id":2,
"name":"",
"objects":[
{
"height":0,
"id":1,
"name":"",
"polygon":[
{
"x":0,
"y":0
},
{
"x":0.165932,
"y":-3.81644
},
{
"x":2.90381,
"y":-3.81644
},
{
"x":3.15271,
"y":-4.6461
},
{
"x":14.3531,
"y":-4.3972
},
{
"x":14.768,
"y":-6.72025
},
{
"x":18.1696,
"y":-6.55432
},
{
"x":23.2305,
"y":-14.5191
},
{
"x":24.475,
"y":-12.196
},
{
"x":26.798,
"y":-11.6982
},
{
"x":30.6145,
"y":-15.0169
},
{
"x":30.7804,
"y":-0.746694
},
{
"x":16.6762,
"y":1.99118
},
{
"x":3.15271,
"y":1.99118
}],
"rotation":0,
"type":"",
"visible":true,
"width":0,
"x":0.912626,
"y":29.7018
}],
"opacity":1,
"type":"objectgroup",
"visible":true,
"x":0,
"y":0
}
}],
"tilewidth":32,
"transparentcolor":"#ff00ff"
},
{
"columns":4,
"firstgid":81,
"image":"npc1.png",
"imageheight":240,
"imagewidth":192,
"margin":0,
"name":"npc1",
"spacing":0,
"tilecount":20,
"tileheight":48,
"tileoffset":
{
"x":-8,
"y":0
},
"tilewidth":48,
"transparentcolor":"#ff00ff"
},
{
"columns":4,
"firstgid":101,
"image":"npc2.png",
"imageheight":240,
"imagewidth":192,
"margin":0,
"name":"npc2",
"spacing":0,
"tilecount":20,
"tileheight":48,
"tileoffset":
{
"x":-24,
"y":0
},
"tilewidth":48,
"transparentcolor":"#ff00ff"
},
{
"columns":4,
"firstgid":121,
"image":"npc3.png",
"imageheight":240,
"imagewidth":192,
"margin":0,
"name":"npc3",
"spacing":0,
"tilecount":20,
"tileheight":48,
"tileoffset":
{
"x":-24,
"y":0
},
"tilewidth":48,
"transparentcolor":"#ff00ff"
},
{
"columns":4,
"firstgid":141,
"image":"npc4.png",
"imageheight":240,
"imagewidth":192,
"margin":0,
"name":"npc4",
"spacing":0,
"tilecount":20,
"tileheight":48,
"tileoffset":
{
"x":-8,
"y":0
},
"tiles":[
{
"animation":[
{
"duration":100,
"tileid":8
},
{
"duration":100,
"tileid":9
}],
"id":8
},
{
"animation":[
{
"duration":100,
"tileid":16
},
{
"duration":100,
"tileid":17
}],
"id":16
}],
"tilewidth":48,
"transparentcolor":"#ff00ff"
},
{
"columns":4,
"firstgid":161,
"image":"npc5.png",
"imageheight":240,
"imagewidth":192,
"margin":0,
"name":"npc5",
"spacing":0,
"tilecount":20,
"tileheight":48,
"tileoffset":
{
"x":-24,
"y":8
},
"tilewidth":48,
"transparentcolor":"#ff00ff"
},
{
"columns":4,
"firstgid":181,
"image":"player.png",
"imageheight":240,
"imagewidth":192,
"margin":0,
"name":"player",
"spacing":0,
"tilecount":20,
"tileheight":48,
"tileoffset":
{
"x":-8,
"y":0
},
"tiles":[
{
"animation":[
{
"duration":100,
"tileid":4
},
{
"duration":100,
"tileid":5
}],
"id":4
},
{
"animation":[
{
"duration":100,
"tileid":8
},
{
"duration":100,
"tileid":9
}],
"id":9
},
{
"animation":[
{
"duration":100,
"tileid":12
},
{
"duration":100,
"tileid":13
}],
"id":13
},
{
"animation":[
{
"duration":100,
"tileid":16
},
{
"duration":100,
"tileid":17
}],
"id":17
}],
"tilewidth":48,
"transparentcolor":"#ff00ff"
}],
"tilewidth":32,
"type":"map",
"version":"1.10",
"width":15
}
A semi-related issue (but still something I have yet to tackle) is custom properties, each object in my scene is interactable and I stored dialog in json format in my Tiled game to be loaded in Phaser, but I'm not entirely sure how to retrieve the custom property, interact from each object. I also use sprites from a bunch of different tilesets for my object layer, obj. I assume it can be loaded regardless, I would just need to specify a list of objects somewhere?
I'm very new to both Phaser and Tiled, so it's possible I'm missing something, but I didn't see many resources that addressed my questions about object layers so I figured I'd ask here.
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
I have the following Tiled tilemap with a tile layer named Bg and 3 object layers named NPC, Obj, and Player respectively
I can load the tile map layer but not the object layers. I'd like to start by loading the player, but when I try to do so I get a sprite placeholder like below:
Here's all the things I tried to create a player. map.createLayer failed because of an invalid layer id (I assume the reason for this is that object layers function differently), using .createFromObjects would always result in a null instance of data, and so getData would return null and nothing for my player would load and retrieving the layer and then the player object doesn't load the sprite either...
As well as the constructor for my player class:
Here's the rest of the code for reference:
And map.json at the end for good measure:
A semi-related issue (but still something I have yet to tackle) is custom properties, each object in my scene is interactable and I stored dialog in json format in my Tiled game to be loaded in Phaser, but I'm not entirely sure how to retrieve the custom property, interact from each object. I also use sprites from a bunch of different tilesets for my object layer, obj. I assume it can be loaded regardless, I would just need to specify a list of objects somewhere?
I'm very new to both Phaser and Tiled, so it's possible I'm missing something, but I didn't see many resources that addressed my questions about object layers so I figured I'd ask here.
Beta Was this translation helpful? Give feedback.
All reactions