Raicon Posted March 10, 2016 Share Posted March 10, 2016 Hello guys, i got a little problem with the rendering of my "blocks" from my tilemap... They are just getting rendered as small stripes. And i dont know why it doesnt render the full blocks... Here are my code snippets index.html <!doctype html> <html> <head> <meta charset="UTF-8" /> <title>Tamashii</title> <script src="phaser.min.js"></script> </head> <body> <script type="text/javascript"> window.onload = function() { //Get windosize var Width = 0, Height = 0; Width = window.innerWidth - 20; Height = window.innerHeight - 20; //Create GameWindow var game = new Phaser.Game(Width, Height, Phaser.AUTO, '', { preload: preload, create: create, update: update, render: render }); //Game variables var map var layer var cursor var player function preload () { game.load.spritesheet('player', 'resources/sprites/character.png', 64, 64); game.load.tilemap('citySylia', 'resources/level/stadt_tamashii.json', null, Phaser.Tilemap.TILED_JSON); game.load.image('tileWorld', 'resources/background/world.png'); } function create () { //General game.physics.startSystem(Phaser.Physics.ARCADE); //World game.stage.backgroundColor = '#787878'; map = game.add.tilemap('citySylia'); map.addTilesetImage('Overworld', 'tileWorld'); layer = map.createLayer('Sylia'); //layer.resizeWorld(); //Player player = game.add.sprite(64, game.world.height - 150, 'player'); game.physics.arcade.enable(player); player.body.collideWorldBounds = true; player.animations.add('up', [105, 106, 107, 108, 109, 110, 111, 112], 10, true); player.animations.add('left', [118, 119, 120, 121, 122, 123, 124, 125], 10, true); player.animations.add('right', [144, 145, 146, 147, 148, 149, 150, 151], 10, true); player.animations.add('down', [131, 132, 133, 134, 135, 136, 137, 138], 10, true); cursor = game.input.keyboard.createCursorKeys(); } function update () { player.body.velocity.x = 0; player.body.velocity.y = 0; if (cursor.left.isDown) { player.body.velocity.x = -150; player.animations.play('left'); } else if (cursor.right.isDown) { player.body.velocity.x = 150; player.animations.play('right'); } else if (cursor.up.isDown) { player.body.velocity.y = -150; player.animations.play('up'); } else if (cursor.down.isDown) { player.body.velocity.y = 150; player.animations.play('down'); } else { player.animations.stop(); player.frame = 130; } } function render() { } }; </script> </body> </html> And my json_map_tile... { "height":7, "layers":[ { "data":[20, 15, 3, 3, 3, 3, 19, 11, 3, 3, 3, 3, 18, 3, 3, 3, 3, 3, 17, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3, 3], "height":7, "name":"Sylia", "opacity":1, "type":"tilelayer", "visible":true, "width":6, "x":0, "y":0 }], "orientation":"orthogonal", "properties": { }, "tilesets":[ { "firstgid":0, "image":"..\/background\/world.png", "imageheight":288, "imagewidth":432, "margin":1, "padding":1, "name":"Overworld", "properties": { }, "spacing":0, "tileheight":16, "tilewidth":16 }], "tilewidth":16, "tileheight":16, "version":1, "width":6 } I hope someone can help me with my problem. And sorry for my bad english :/ greetings Raicon Link to comment Share on other sites More sharing options...
Raicon Posted March 11, 2016 Author Share Posted March 11, 2016 Sorry for the double post, but does anybody know what the problem is? I need to get it fixxed as quick as i can. But i tried all, but nothing is working. Link to comment Share on other sites More sharing options...
Raicon Posted March 12, 2016 Author Share Posted March 12, 2016 Now it works fine. The tilemap was the problem... Link to comment Share on other sites More sharing options...
Recommended Posts