/
set-marker-z-index-v3.html
38 lines (38 loc) · 1.2 KB
/
set-marker-z-index-v3.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<!DOCTYPE html>
<html>
<head>
<link href="../assets/styles.min.css" rel="stylesheet">
<title>Google Maps: Set Marker Z-Index (v3)</title>
<script src="//maps.googleapis.com/maps/api/js?v=3&sensor=false&key=AIzaSyA7mayyJzzigBiPeHJ4pe8fm_gLz-mT4qU"></script>
</head>
<body>
<div id="mapdiv" style="height: 400px;"></div>
<script>
/*
* Google Maps: Set Marker Z-Index (v3)
* https://salman-w.blogspot.com/2012/07/change-z-index-google-map-v3-markers.html
*/
google.maps.event.addDomListener(window, 'load', function() {
var map = new google.maps.Map(document.getElementById("mapdiv"), {
center: new google.maps.LatLng(33.810890, -117.918772),
zoom: 8,
mapTypeId: google.maps.MapTypeId.ROADMAP
});
new google.maps.Marker({
position: map.getCenter(),
map: map,
title: "Topmost Marker",
icon: "marker-green-v3.png",
zIndex: google.maps.Marker.MAX_ZINDEX + 1
});
for (var i = 0; i < 10; i++) {
new google.maps.Marker({
position: new google.maps.LatLng(map.getCenter().lat() + Math.random() * 0.4 - 0.2, map.getCenter().lng() + Math.random() * 0.4 - 0.2),
map: map,
title: "Random Marker #" + (i + 1)
});
}
});
</script>
</body>
</html>