Jump to content

Avoid stacking tilemaps?


Recommended Posts

Hey guys,


i got a litte problem. Im working on a project for my school and now i got the problem that my world is stacking tilemaps, which causes lags after sometime.
I dont know how i can avoid it to stack the tilemaps.....

Here u can test it if u dont understand what i mean: http://aincrad.us/game/ (Go into a house and go back to the world and do this some times and it will be laggy as hell!)

My JS Codes can be fully watched on http://aincrad.us/game/js/

But here is my index.html which handel the "loading" in parts.

<!doctype html>
        <meta charset="UTF-8" />
        <script src="phaser.min.js"></script>
			body { 
				margin: 0 auto;
				margin-top: 50px;
				width: 329px;
				height: 288px;
				background-color: black;
		<script src="js/functions.js"></script>
		<script src="js/variables.js"></script>
		<script src="js/player.js"></script>
		<script src="js/map.js"></script>
    <script type="text/javascript">
    window.onload = function() {
		//Get windosize
		var Width = 0, Height = 0;
		Width = window.innerWidth - 20;
		Height = window.innerHeight - 20;
		//Create GameWindow
		//Pokemon Width = 144, Height = 160
        game = new Phaser.Game(320, 288, Phaser.AUTO, '', { preload: preload, create: create, update: update, render: render });

		//General Game
        function preload () {
			game.load.spritesheet('player', 'resources/sprites/bonus1.png', 26, 36);
			game.load.tilemap('citySylia', 'resources/level/stadt_sylia.json', null, Phaser.Tilemap.TILED_JSON);
			game.load.tilemap('house01', 'resources/level/haus01.json', null, Phaser.Tilemap.TILED_JSON);
			game.load.spritesheet('trainer', 'resources/background/secret.png', 16, 16);
			game.load.tilemap('secretAlabastia', 'resources/level/stadt_alabastia.json', null, Phaser.Tilemap.TILED_JSON);

			game.load.image('tileOutside', 'resources/background/outside.png');
			game.load.image('tileWater', 'resources/background/water.png');
			game.load.image('tileHouse', 'resources/background/house.png');
			game.load.image('tileInside', 'resources/background/inside.png');
			game.load.image('tileSecret', 'resources/background/secret.png');

        function create () {

			cursor = game.input.keyboard.createCursorKeys();
		function update () {
			game.physics.arcade.collide(player, collision);
			if(map.key === 'secretAlabastia' && player.key === 'player') {
			var mapKey = overlapCallback(map.key, player.body);
			if(mapKey != '') {
				if(isHouse(map.key)) {
				} else {

		function render() {
			//game.debug.spriteInfo(player, 32, 32);


The fully plaintext can be used by everyone. ;)

Does anyone know how i can fix my map stacking?

Link to comment
Share on other sites

Problem is, even if you reinitialize your map, the old map is preserved in memory because Phaser keeps references to it, too.  Try adding this to your loadPlace functions:



//recreate map and layers

Here's an example in a Ludum Dare game I made not long ago:

Check out the _createMap function.

Link to comment
Share on other sites


  • Recently Browsing   0 members

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