2015-07-10 41 views
0

我試圖顯示超過一公里負載谷歌地圖API。什麼是最好的方式去做這件事?現在它只顯示第一公里。顯示超過一公里的谷歌地圖API負載

這是我的腳本。 感謝您的期待。

<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&signed_in=true"></script> 
    <script> 
function initialize() { 
var myLatlng = new google.maps.LatLng(-105.467, 39.973); 
    var mapOptions = { 
     zoom: 10, 
     center: myLatlng, 
     mapTypeId: google.maps.MapTypeId.SATELLITE 
    }; 

    var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions); 

    var sitesLayer = new google.maps.KmlLayer({ 
    url: 'https://example.com/kml-kmz-files/basins.kml' 
    }); 
    sitesLayer.setMap(map); 

    var basinLayer = new google.maps.KmlLayer({ 
    url: 'https://example.com/kml-kmz-files/boundries.kml' 
    }); 
    basinLayer.setMap(map); 
} 


google.maps.event.addDomListener(window, 'load', initialize); 

    </script> 
+0

沒有什麼錯你的方法。別的東西一定是錯的。嘗試使用'sitesLayer.getStatus()'和'basinLayer.getStatus()檢查圖層狀態' – amenadiel

回答

0

通常所有層將被吸引(只要不超過任何限制),但是API可以只設置視口包含一個單層的特徵(這取決於加載順序上它將是哪一層)。

要設置視口以使其包含每個圖層的要素,必須將圖層的preserveViewport屬性設置爲true,並自行處理地圖視口的設置。

樣品的實現:

function initialize() { 
 
var myLatlng = new google.maps.LatLng(0,0); 
 
    var mapOptions = { 
 
     zoom: 18, 
 
     center: myLatlng 
 
    }; 
 

 
    var map = new google.maps.Map(document.getElementById('map'), mapOptions); 
 

 
    loadKml=function(opts,map){ 
 
    var layer=new google.maps.KmlLayer(); 
 
    opts.preserveViewport=true; 
 
    if(map){opts.map=map;} 
 
     
 
    google.maps.event.addListener(layer,'defaultviewport_changed',function(){ 
 
     var map=this.getMap(), 
 
      bounds=map.get('kmlBounds')||this.getDefaultViewport(); 
 
      
 
     bounds.union(this.getDefaultViewport()); 
 
     map.set('kmlBounds',bounds); 
 
     map.fitBounds(bounds); 
 
    }); 
 
    layer.setOptions(opts); 
 
    return layer; 
 
    } 
 
    //blue pins 
 
    var sitesLayer = loadKml({ 
 
    url: 'https://www.google.com/maps/d/kml?mid=z_0vvigsiMo4.kV0iI47miw1A', 
 
    map:map 
 
    }); 
 
    //red star 
 
    var basinLayer = loadKml({ 
 
    url: 'https://www.google.com/maps/d/kml?mid=z4jtZiEBVczE.kp_M0KHEIung' 
 
    },map); 
 
    
 
} 
 

 

 
google.maps.event.addDomListener(window, 'load', initialize);
html,body,#map{height:100%;margin:0;padding:0}
<script src="https://maps.googleapis.com/maps/api/js?v=3"></script> 
 
<div id="map"></div>