Google Maps V3：页面上有多个地图导致标记丢失（DEBUG）？

Question

我在一个页面上有多个谷歌地图。

场景：

• 在页面上单独使用时，地图正在按预期工作。
• 我在同一页面上使用了2张地图。

工作案例： :)

• 第一张地图使用Unstyled-Markers（默认标记）
• 第二张地图使用Styled-Markers [参考： 样式标记 ]
• 两个地图都按预期显示标记。
• 请参阅[ http://pastebin.com/ciphPXZc ]上的代码

问题案例 :(

• 第一张地图使用样式标记[参考： 样式标记 ]
• 第二张地图使用Unstyled-Markers（默认标记）
• 第一张地图根本没有标记
• 请参阅[ http://pastebin.com/HyYhgsbm ]上的代码

即使没有变量名冲突，我也无法理解地图如何相互影响。

此外，地图的顺序如何影响它？

如果我遗漏了什么，请帮助，询问更多信息。

Answer 1

这是因为您加载API和StyledMarker扩展的方式。 只做一次，并尽早（最好在<head>部分）。

<html>
<head>
    <script src="http://maps.googleapis.com/maps/api/js?v=3.6&sensor=true&language=en-us"></script>
    <script src="/site_media/js/google_maps/StyledMarker.js"></script>
</head>

不要在任何其他地方包含脚本。

在第一个示例中，您加载API，然后再次执行该操作然后再执行StyledMarker扩展，然后调用map1()和map2() 。 但是因为最后加载了StyledMarker扩展，所以一切正常。

在第二个示例中，您加载API和StyledMarker扩展，然后再次加载API，然后调用map1()并尝试使用样式标记。 但是，第二次加载API可能已经消除了StyledMarker扩展。