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

を指定しzIndexて追加する必要があります

optimized: false

すべてのマーカーコンストラクターに。

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

これは、マーカーの新しいキャンバスベースのレンダリングの問題のようです。

編集：

これは本当に問題を解決します。ただし、すべてのマーカーに「optimized：false」属性が必要であることに注意してください。1つのマーカーにそれがない限り、それは機能しません。

LeJaredのフィドルから「optimized：false」属性のいずれかを削除すると、バグが発生します。

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

私は少しfiddlを作りました：http： //jsfiddle.net/gSRmV/

バグのようですが、グーグルで修正する必要があります。

追加optimized: falseしても何も変わりません。

編集：まだバグのように見えますが、tborychowskiとCodetoffelの2つの解決策は機能しているようです。

于 2012-08-21T21:55:56.670 に答える