如何在google map中处理大量标记原创
想吃糖的木子小
2.addOverlay()逐个的将每一个Marker添加到Map。MarkerManager会不断你所有的标记。通过定义几个不同的zoom-levels,将可能会同时出现的Marker集合放在同一level上,避免在同一时间大量的Marker同时显示。MarkerManager 最初比直接加入到地图中有些慢,但是这样添加的好处是你可以更好的控制它们。使用addMarker(GMarker, minZoom, maxZoom?)将标记添加到MarkerManager,这个方法携带三个参数,第一个是你要添加的标记,后两个参数是可选的,但是界定了在什么level上这个标记是可见的。A simple example//Create a new mapvar map=new GMap2(document.getElementById('map'));map.setCenter(new GLatLng(5
9.5,1
4.0),6);//Create a new instance of the MarkerManagervar mgr = new MarkerManager(map);// Create a new marker var marker = new GMarker(new GLatLng(5
9.0, 1
3.80)); // Add marker to the MarkerManager mgr.addMarker(marker);明显的,没有谁会想MarkerManager添加单一的标记,但是如果你有几百个标记,那么可能就要这么做了。Bulk adding the markers使用MarkerManager更高效的办法是,首先将所有标记添加到一个数组中,然后用addMarkers(markerArray, minZoom, maxZoom?)将这个数组添加到MarkerManager。// Create a new instance of the MarkerManager var mgr = new MarkerManager(map); // Create marker array var markers = []; // Loop to create markers and adding them to the MarkerManager for(var i = 0; i < 50; i += 0.1) { var marker = new GMarker(new GLatLng(5
9.0 + i, 1
3.80 + i)); markers.push(marker); } // Add the array to the MarkerManager mgr.addMarkers(markers); // Refresh the MarkerManager to make the markers appear on the map mgr.refresh();请注意,在将存有标记数组添加到MarkerManager之后,必须调用mgr.refresh()。在逐个添加Marker的时候是不需要的。附加方法removeMarker(marker)从MarkerManager中移除一个标记。clearMarkers()移除所有标记。getMarkerCount(zoom)返回在指定的zoom-level下的标记个数。MarkerManager是Google提供的一个实用工具库。从下面的链接你可以源代码以及说明和例子。Google Maps MarkerManager SVN:链接 Light - Markers on a diet(高亮标记-首都标记)Google的Pamela Fox 为减少复杂标记,从而提高效率的MarkerLight制作了一个简单的程序。这样做的代价是,真的仅仅是在地图上显示一个图片,但你不能与之交互。如果你不需要与程序交互,那么这种办法真的是一种简单的提高性能的办法,这样做唯一的区别就是你创建的是一个MarkerLight,而不是一个GMarker。作者Pamelas后来解释了为什么这种方法会提高效率:GMarker之所以耗时这么长是因为它实际上是由多个DOM元素构成-前景,阴影,打印版本,可点击区域等。如果你的目的只是显示,那么你可以选择象MarkerLight那样创建一个带有背景URL的DIV那样去创建一个GOverlay的扩展(或者背景颜色、甚至更好的)------Pamela Fox以下是如何使用它:map.addOverlay(new MarkerLight(latlng, {image: "red_dot.png"}));red_dot.png这个图片是用于marker中的。这是最小最简单的一个。你可以尝试在Pamelas test page上用不同数量的标记测试效率。Download markerlight.Using Marker Light in combination with MarkerManager-结合MarkerManager使用Marker Light用MarkerManager的集中式添加MarkerLight的好处很多,而且真的很简单,只是将二者结合起来。mgr.addMarker(new MarkerLight(latlng, {image: "red_dot.png"}));这样做的原因是你可以显示在不同缩放级别下不同数量的标记。这种方式可以确保不会有太多的标记在同一时间显示。Clusterer - Only show what you need另一种方法是使用ACME实验室群集Clusterer。这是一个第三方库,提供了更快捷的方式加入标记。它是在BSD许可证下发布,并免费提供。只需要做两件事情,效率会更快:
1.只有当前可见的标记会被建立。
2.如果有太多的标记需要显示,那么它们会组合在一起成为群集标记。 这会让你的地图上即使有成千上万个标记依然能保持良好的性能。我的测试表明,这种方法的效率要显著快于使用MarkerManager的方式。以下是如何使用它: // Create a Clusterer object var clusterer = new Clusterer(map); // Create marker var marker = new GMarker(new GLatLng(5
7.8, 1
4.0)); // Add marker to the map clusterer.AddMarker(marker, 'text to infobox'); 调用clusterer.RemoveMarker(marker)方法来从Map中移除标记。另外还有一些方法来改变标志的行为。
1. clusterer.SetIcon(GIcon) 改变簇的图标
2. clusterer.SetMaxVisibleMarkers(n) 设置标记最多可见的数量门限,默认值是150.
3. clusterer.SetMinMarkersPerCluster(n)为一个标记集合设置最少的标记数,默认值是
5.
4. clusterer.SetMaxLinesPerInfoBox(n)设置信息框内文本的最大行数,默认值是
10.Download Clusterer
2.ClusterMarker - Chunk 'em all upClusterMarker是一个根据GNU通用公共许可证发布的免费javascript库,可以集中添加标记。这个库的独特行在于它会自动检测标记,彼此相交和集成为一个标记群集。
2021-09-23 17:37:34 1010查看 1回答
2021-09-23 17:38:29 1239查看 0回答
2021-09-23 17:39:33 439查看 3回答
2021-09-23 17:39:46 462查看 2回答
2021-09-23 17:39:46 407查看 2回答
2021-09-23 17:54:28 390查看 0回答