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);
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.
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!
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.
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.
MAX_ZINDEX
is 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.
Most of your code makes sense, but your definition of the MarkerOptions
api-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.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With