如何在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庫,可以集中添加標記。這個庫的獨特行在于它會自動檢測標記,彼此相交和集成為一個標記群集。
wakawaka
2021-09-23 17:40:38 1154查看 1回答
2021-09-23 17:41:34 1250查看 0回答
王寧
2021-09-23 17:42:33 574查看 3回答
大米
2021-09-23 17:42:45 619查看 3回答
魔叉詩人-老時
2021-09-23 17:42:45 512查看 2回答
想吃糖的木子小
2021-09-23 17:42:45 532查看 2回答
Without You
2021-09-23 17:43:13 724查看 2回答