如果标记太多，如何在Google地图上优化MarkerWithLabel

Question

我一直在使用谷歌浏览器开发一个应用程序，我一直在使用MarkerWithLabel库，我认为这是由谷歌开发人员编写的。我在地图上使用了超过100个标记，它似乎非常流畅，直到我在firefox中检查（甚至不提IE）。在FF中它非常迟钝。有什么办法优化它？

http://jsfiddle.net/zDTNS/2 Here is a sample in jsfiddle

为了澄清，有200个常规标记工作正常。使用MarkerWithLabel时出现问题

Answer 1

一般来说，优化任何Google地图应用程序的最佳方法是使用群集技术。随着应用程序加载越来越多的标记，客户端渲染开销只会增加。添加标签只会增加问题。

存在许多集群技术并且易于实现，我建议从本文开始：https://developers.google.com/maps/articles/toomanymarkers。

编辑如果有人没有相同的规格要求，但类似的问题，请留在上面。

我唯一的另一个建议是在超过某个缩放级别时关闭标签？这至少可以缓解一些最糟糕的渲染问题。

编辑经过一些研究后，已经证明，here引入的库具有比markerWithLabel更有利的性能特征。它依赖于html画布，尽管ie9 +。

Answer 2

经过2周的研究和尝试各种方法，大多数建议在这里，我得出结论，目前没有办法优化。出于某种原因，当地图顶部有div并保持同步时，firefox会挣扎。最新的Firefox的性能几乎与IE8相同。

我发现拥有大量的谷歌标记不会导致任何滞后，但div会这样做。我最终做的是创建一个服务器端函数，将文本转换为png。初始化Google标记时，您可以创建图标网址TextToImage.aspx?text=Hello&size=13 然后我将新标记的锚点设置为（15,15），这就成了我的新标签。我在标签标记处添加了一些click和mouseover监听器，瞧！疯狂改善表现。

Answer 3

如果您只希望在图钉中包含几个字符，则另一种选择是：

https://chart.apis.google.com/chart?chst=d_map_pin_letter&chld=${displayCharacters}|${pinColorHex}|${fontColorHex}

选中this example。