0

我想將谷歌地圖v3元素加載到我的網站,用戶可以在其中動態選擇某些過濾器來顯示某些標記。然後將結果序列化爲映射對象用於設置指定標記的JSON文件。谷歌地圖v3 - 縮放到標記時出錯

我試圖做一個測試頁面,如下所示:

@section headerScripts { 
    <script src="~/Scripts/jquery-1.9.1.js"></script> 
    <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script> 

    <script type="text/javascript"> 
     var map; 
     var latlng = new google.maps.LatLng(56.29216, 10.34912); 
     var markerList = []; 

     function initialize() { 
      var mapOptions = { 
       zoom: 7, 
       center: latlng, 
       mapTypeId: google.maps.MapTypeId.ROADMAP 
      } 
      map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions); 
     } 

     function addMarkers(stores) { 
      for (var i = 0; i < stores.length; i++) { 
       var marker = new google.maps.Marker({ 
        position: new google.maps.LatLng(stores[i].Latitude, stores[i].Longitude), 
        map: map, 
        title: stores[i].Name 
       }); 
       markerList.push(marker); 
      } 
      zoomToMarkers(); 
     } 

     function zoomToMarkers() { 
      var latlngbounds = new google.maps.LatLngBounds(); 
      markerList.forEach(function (n) { 
       latlngbounds.extend(n); 
      }); 
      map.setCenter(latlngbounds.getCenter()); 
      map.fitBounds(latlngbounds); 
     } 

     $(document).ready(function() { 
      initialize(); 
      $.getJSON("/Product/GetStore/", addMarkers); 
     }); 

    </script> 
} 

<div id="map-canvas" style="width: 500px; height: 500px;"></div> 

它集標記好了,那工作,但我想一個函數來放大,因此,只有在標誌物地圖顯示在「縮放」中。但是,當我打電話zoomToMarkers(基於函數我在網上找到) - 我從谷歌地圖的js文件得到一個錯誤:

https://maps.gstatic.com/intl/da_dk/mapfiles/api-3/12/9/main.js 16行,列353 未處理的異常 0x800a01b6 - 微軟JScript運行時錯誤:對象不支持屬性或方法「拉特」

我不知道爲什麼會發生這種情況,因爲它似乎很多其他人已經得到它的工作。你們能幫忙嗎?

+0

請看看我的類似問題 - http://stackoverflow.com/questions/19447723/google-map-zoom-error-when-reload – 2013-10-18 10:50:02

回答

0

我自己發現了這個錯誤。問題是在這一行

latlngbounds.extend(n); 

我被添加到latlngbounds而不是座標的標記對象。所以我把它校正爲該:

function addMarkers(stores) { 
    for (var i = 0; i < stores.length; i++) { 
     var marker_latlng = new google.maps.LatLng(stores[i].Latitude, stores[i].Longitude); 
     var marker = new google.maps.Marker({ 
      position: marker_latlng, 
      map: map, 
      title: stores[i].Name 
     }); 
     latlngbounds.extend(marker_latlng); 
    } 
    zoomToMarkers(); 
} 

function zoomToMarkers() { 
    map.setCenter(latlngbounds.getCenter()); 
    map.fitBounds(latlngbounds); 
} 

這完美的作品!