6

我試過使用谷歌地圖標記管理器,但我似乎每次點擊磚牆,我遵循教程如何在谷歌文檔上創建markermanager,但它似乎沒有任何工作適合我,這是我的代碼如何編寫的問題?在這裏用完了想法,目前我已經設置了一個標記,以便根據latlng在地圖上下拉。谷歌地圖標記管理器V3

有人可以嘗試像執行教程代碼,找到一個工作解決方案嗎?它讓我瘋狂。

@{ 
    ViewBag.Title = "Index"; 
} 

<h2>Index</h2> 

<div id="map_canvas" style="width:500px; height:500px;"></div> 

    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 

    @*<script src="../../Scripts/markermanager.js" type="text/javascript"></script>*@ 

    <script type="text/javascript"> 

     function initialize() { 
      var latlng = new google.maps.LatLng(-34.397, 150.644); 
      var myOptions = { 
       zoom: 8, 
       center: latlng, 
       mapTypeId: google.maps.MapTypeId.ROADMAP // map view, can be set to satellite, street, roadview, aerialview 
      }; 
      map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 

      var marker = new google.maps.Marker({ 
       position: latlng, 
       map: map, 
       animation: google.maps.Animation.DROP, 
       title: "Uluru (Ayers Rock)" 
      }); 

      marker.setMap(map); 
     } 

     $(document).ready(function() { 
      initialize(); 
     }); 

    </script> 
+1

你已經包括了文件,但你不使用標記管理類上面的代碼。這是爲什麼? –

+0

帶來錯誤:GBounds未定義 [Break On This Error] GBounds.prototype.containsPoint = function(point){在markermanager.js文件中 – MJCoder

+0

您正在使用什麼標記管理器?您是否使用GMAP API v3爲GMAP API v2製作的標記管理器? –

回答

15

下面是一個例子,讓你開始:

var map; 
 
var mgr; 
 

 
function initialize() { 
 
    var myOptions = { 
 
    zoom: 8, 
 
    center: new google.maps.LatLng(-34.397, 150.644), 
 
    mapTypeId: google.maps.MapTypeId.ROADMAP 
 
    }; 
 
    map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); 
 
    mgr = new MarkerManager(map); 
 
    google.maps.event.addListener(mgr, "loaded", function() { 
 
    for (var i = 0; i < 1000; i++) { 
 
     var marker = new google.maps.Marker({ 
 
     position: new google.maps.LatLng(Math.random() * 180 - 90, Math.random() * 360 - 180), 
 
     title: "Random marker #" + i 
 
     }); 
 
     mgr.addMarker(marker, 0); 
 
    } 
 
    mgr.refresh(); 
 
    }); 
 
} 
 
google.maps.event.addDomListener(window, "load", initialize);
<script src="http://maps.googleapis.com/maps/api/js?sensor=false"></script> 
 
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/trunk/markermanager/src/markermanager.js"></script> 
 

 
<div id="map_canvas" style="height: 400px;"></div> 
 
<p>Pan or zoom out to see markers</p>

注意到在創建標記時,我沒有指定map: mapmarker.setMap(map)。相反,將標記添加到標記管理器,然後在您撥打markermanager.refresh()時將標記添加到地圖中。

另請注意,我在縮放級別0上添加了所有標記。理想情況下,您應該在較低縮放級別加載少量標記,在較高縮放級別加載更多標記。

+0

優秀的例子..正是我需要的,所以我看到我們已經使用了一個for循環,它將創建多達1000個標記,並使用math.random()隨機放置它們,我如何得到它,所以當地圖加載所有標記顯示時沒有放大或縮小以查看它們全部? 它會是這樣的:map.fitBounds(latlngbounds); – MJCoder

+0

上面的例子我如何將所有標記放在地圖上而不放大/縮小? map.fitBounds();是這樣嗎? – MJCoder

+0

現在爲我工作,現在我會看MVC3中的JSON結果:) 謝謝薩爾曼:) – MJCoder