How can I change the z-index of a TileMap? Or add a TileMap to a group?

[Noahdecoco]

Hey guys,

 

I'm building a top-down view racing game and I'm hitting a road block (pun unintended) when I try to place the players (the cars) above the map.

 

What I'm trying to do is create two groups (game.add.group()), one for the map and one for the players. I am able to add the players to the player group (z-index of 2), but I can't add the map to the map group (z-index of 1).

 

As you can see in the screen shot, the car is below the road.

 

Could someone please explain how one goes about changing the z-index of TileMaps? How does one do it if there are multiple maps and needs to have the player in between them?

 

Thanks in advance!

Racer.Game = function(game){};Racer.Game.prototype = {	create: function() {		GAME.players = [];		GAME.physics.startSystem(Phaser.Physics.P2JS);		this.mapLayer = this.add.group();		this.mapLayer.z = 1;		this.carLayer = this.add.group();		this.carLayer.z = 2;		// Setup the Map/Level		var map = new Phaser.Tilemap(GAME, 'level1');		map.addTilesetImage('Tile Sheet', 'tiles');		map.createLayer('track');				// this.mapLayer.add(map);  // THIS DOESN"T WORK?!				// Setup the Players		var p1_keys = GAME.input.keyboard.createCursorKeys();		player1 = new Car(200, 200, 'carYellow', p1_keys, this.carLayer);	},	update: function() {		for (var player in GAME.players) {			GAME.players[player].update();		}	}	};var Car = function(x, y, colour, keys, layer) {	this.turn_speed      = 4;	this.current_speed   = 0;	this.acceleration    = 15;	this.ground_friction = 0.98;	this.key_input = keys;	var car = new Phaser.Sprite(GAME, x, y, colour);	car.anchor.setTo(0.5, 0.5);		layer.add(car);	GAME.physics.p2.enable(car, false);	this.car = car;	GAME.players.push(this);};Car.prototype.update = function() {	this.current_speed *= this.ground_friction;	if (this.key_input.up.isDown) {		this.current_speed += this.acceleration;	}	if (this.key_input.down.isDown) {		this.current_speed -= this.acceleration;	}	if(this.key_input.left.isDown) {		this.car.body.angle -= this.turn_speed;	}	if(this.key_input.right.isDown) {		this.car.body.angle += this.turn_speed;	}		this.car.body.moveForward(this.current_speed);}

[Noahdecoco]

Bump... 

[tsphillips]

If you want the car to draw on top of the tilemap layers, try this:

 

this.car.bringToTop();

 

Tom