Reputation: 1293
I'm using Google Maps javascript v3 to print markers on the map, getting them from my database.
I need to put a marker overlapping another one. For example, I have my map like this:
I need to set the green marker over the orange one.
I thought It was enough if i order the query (ORDER BY
) but it doesn't work.
Here is my javascript function:
function CargarJson() {
$.ajax({
url: '../view/cp_mapconductores_json.php',
method: 'get',
cache: false,
success: function (data) {
for (var i = 0; i < data.length; i++) {
var datos = data[i];
var LatLng = new google.maps.LatLng(datos.latitud, datos.longitud);
var texto = datos.conductor + " / " + datos.marca + " " + datos.placa;
var estado = datos.estado;
var icono;
if (estado == 0) { //inactivo
icono = "../images/taxi-blanco.png";
} else if (estado == 1) { // disponible
icono = "../images/taxi-verde.png";
} else if (estado == 2) { // ocupado
icono = "../images/taxi-naranja.png";
} else {
icono = "../images/taxi-negro.png";
}
var marcador = new google.maps.Marker({
position: LatLng,
map: map,
title: texto,
icon: icono
});
markers.push(marcador);
var infoWindow = new google.maps.InfoWindow();
(function (marcador, datos) {
google.maps.event.addListener(marcador, 'click', function (e) {
infoWindow.setContent('<b>' + datos.conductor + '</b> <br>'
+ datos.marca + ' ' + datos.placa);
infoWindow.open(map, marcador);
});
})(marcador, datos);
}
},
error: function () {
alert("Se produjo un error en la lectura de datos!");
}
});
}
Thanks for answer.
Upvotes: 0
Views: 1123
Reputation: 161384
Use the zIndex property of the MarkerOptions:
zIndex | number | All markers are displayed on the map in order of their zIndex, with higher values displaying in front of markers with lower values. By default, markers are displayed according to their vertical position on screen, with lower markers appearing in front of markers further up the screen.
Upvotes: 1