Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Put marker from Google Maps v3 in front of all others

Can somebody help me put the current location in front of all others? I have read about MAX_ZINDEX and setZindex() but I cannot understand it. This is my code:

var latlng = new google.maps.LatLng(lat,lng);
var image = "";
var currentplace = "Ohla Hotel";
var zInd = "";
if( name == currentplace ) {
    image = "../img/hotel_icon.png";
}
else {
    image = "../img/home_icon.png";
}
//alert();
var maxZindex = google.maps.Marker.MAX_ZINDEX;
if( name == currentplace ) {
    zInd = (maxZindex + 1);
}
var locationDescription = this.locationDescription;
var marker = new google.maps.Marker({
    map: map,
    position: latlng,
    title:'pk:'+name,
    MAX_ZINDEX: zInd,
    icon: image
});
bounds.extend(latlng);
setMarker(map, marker, name, locationDescription);
like image 438
outman Avatar asked Jun 17 '12 01:06

outman


People also ask

How do I add an image to a Google Maps marker?

In the most basic case, an icon can specify an image to use instead of the default Google Maps pushpin icon. To specify such an icon, set the marker's icon property to the URL of an image. The Maps JavaScript API will size the icon automatically. // Australia. Note: Read the guide on using TypeScript and Google Maps. // Australia.

How to retrieve all markers from Google map?

I initialized Google Map and added markers to it. Later, I wanted to retrieve all markers and did it simply by accessing the map property "markers". You can loop over it and access all Marker methods listed at Google Maps Reference. Thanks for contributing an answer to Stack Overflow!

How do i Zoom in on Google Maps with markers?

Inside the loop each marker’s position is added to the LatLngBounds object of Google Maps. Once all the markers are added to the Google Map, the LatLngBounds object is used to determine the center and adjust zoom in such a way that all the markers are visible in best possible zoom of the Google Map.

How do I move a marker on the map?

You can allow users to move a marker on the map by setting the marker's draggable property to true . For more information about draggable markers, see below. The google.maps.Marker constructor takes a single Marker options object literal, specifying the initial properties of the marker.


2 Answers

MAX_ZINDEXis a constant, not an attribute of a marker.

The relevant MarkerOption is zIndex:

var marker = new google.maps.Marker({
    map: map,
    position: latlng,
    title:'pk:'+name,
    zIndex: zInd,
    icon: image
});

This sets the marker's zIndex attribute to the value you have calculated, which is one more than the API's maximum value.

like image 157
Andrew Leach Avatar answered Oct 28 '22 21:10

Andrew Leach


Most of your code makes sense, but your definition of the MarkerOptionsapi-doc object doesn't make sense. Try changing your marker creation code to this:

var marker = new google.maps.Marker({
    map: map,
    position: latlng,
    title:'pk:'+name,
    zIndex: zInd,
    icon: image
});

Since you have already set the value of zInd higher than google.maps.Marker.MAX_ZINDEX, making this change should place the marker higher in the zIndex and thus above the other markers on the map.

like image 27
Sean Mickey Avatar answered Oct 28 '22 20:10

Sean Mickey