23

当我使用不同的图标类型向 Google 地图添加更多标记时，例如：

...
var marker = new google.maps.Marker({
             position: markerLatLng,
             map: map,
             icon: "http://www.test.com/marker.png",
             zIndex: 10
         });
...

和

...
var resultIcon = {
            path: google.maps.SymbolPath.CIRCLE,
            fillColor: "black",
            strokeColor: "black",
            strokeWeight: 1,
         };

var marker = new google.maps.Marker({
             position: markerLatLng,
             map: map,
             icon: resultIcon,
             zIndex: 5
         });
...

比 zIndex 不起作用，符号标记出现在顶部。

我的代码错了还是如何使 zIndex 正常工作？

4

3 回答 3

47

您必须同时指定 azIndex并添加

optimized: false

到每个标记构造函数，例如。

var marker = new google.maps.Marker({
    position: markerLatLng,
    map: map,
    icon: resultIcon,
    optimized: false,
    zIndex: 5
})

这似乎是新的基于画布的标记渲染的问题。

编辑：

这确实解决了问题。不过要提到的一件事是，每个标记都必须具有“优化：假”属性。只要一个标记没有它，它就不会起作用。

从 LeJared 的小提琴中删除任何“优化：错误”属性，您将遇到该错误。

http://jsfiddle.net/BNWYq/1/

于 2012-08-21T19:20:42.053 回答
9

将圆圈的 zIndex 设置为 -99 似乎有帮助：http: //jsfiddle.net/rq4vs/2/

于 2012-08-22T09:50:54.517 回答
0

我做了一个小技巧：http: //jsfiddle.net/gSRmV/

看起来像一个错误，必须由谷歌修复。

添加optimized: false不会改变任何东西。

编辑：看起来仍然像错误，但 tborychowski 和 Codetoffel 的两个解决方案似乎有效。

于 2012-08-21T21:55:56.670 回答