Forums » Help » backgroundMaps stuck in foreground

For some reason, the below code keeps drawing over the player. I just can't figure out why. Any help is epically appreciated. :) Aside from drawing on the wrong layer, it works fine. :)

draw: function () {
    this.parent();
      
    var dMap = [[1,2,3,4],[5,6,7,8],[9,10,11,12]];
    var dDraw = new ig.BackgroundMap(8, dMap, 'media/tiles.png');
    dDraw.foreground = false;
    dDraw.setScreenPos(-16, -16);
    dDraw.draw();
}

The call to this.parent() draws the entities. The call to dDraw.draw() draws the map - and because it's drawn after the entities, it's drawn "on top" of them.

The way it is now, you're creating a new background map for each frame. I don't think that this is what you want.

You should create your background map just once at game start (in your init() method) and then attach it to the game's array of background maps so it gets drawn automatically.

So get rid of your draw method (or just call this.parent() and nothing else) and do this in your game's init:

init: function () {    
	var dMap = [[1,2,3,4],[5,6,7,8],[9,10,11,12]];
	var dDraw = new ig.BackgroundMap(8, dMap, 'media/tiles.png');
	this.backgroundMaps.push( dDraw );
}

Have a look at the Drop Source Code.