google map api v3, getBound();不返回当前视口的后期/液化边界

google map api v3 , getBound(); doesn't returns the lat/lng bounds of the current viewport

本文关键字：视口 边界 返回 v3 api map getBound google      更新时间：2023-09-26

我需要将我的mashup页面的代码从google map api v2升级到v3。但是getBound()不能与新代码一起工作!错在哪里?提前谢谢你。

旧代码是:

   <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key= (my key api)"
      type="text/javascript"></script>
    <script type="text/javascript">
    function updateStatus() {
      var div = document.getElementById('mapinfo');
      div.innerHTML = map.getBounds();
      document.forms[0].lat0.value = map.getBounds().getSouthWest().lat();
      document.forms[0].lon0.value = map.getBounds().getSouthWest().lng();
      document.forms[0].lat1.value = map.getBounds().getNorthEast().lat();
      document.forms[0].lon1.value = map.getBounds().getNorthEast().lng();
      get_pictures();
    }
    function onMapMove() {
      //map.setCenter(map.getCenter());
      updateStatus();
    }
    function onMapZoom(oldZoom, newZoom) {
      //map.setCenter(map.getCenter(),newZoom)
      updateStatus();
    }

    function load() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map"));
        window.map = map
        map.setCenter(new GLatLng(41.879786443521795,12.427597045898438), 6);
        map.addControl(new GSmallMapControl());
        map.addControl(new GMapTypeControl());
        window.kh = new GKeyboardHandler(map);
        GEvent.addListener(map,'moveend',onMapMove);
        GEvent.addListener(map,'zoomend',onMapZoom);
        updateStatus();
      }
    }
    </script>
新代码:

 <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key= (my api key)"
      type="text/javascript"></script>
       <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
      <script type="text/javascript"
  src="https://maps.googleapis.com/maps/api/js?libraries=weather&sensor=true">
</script>
    <script type="text/javascript">
    function updateStatus() {
      var div = document.getElementById('mapinfo');
      div.innerHTML = map.getBounds();
      document.forms[0].lat0.value = map.getBounds().getSouthWest().lat();
      document.forms[0].lon0.value = map.getBounds().getSouthWest().lng();
      document.forms[0].lat1.value = map.getBounds().getNorthEast().lat();
      document.forms[0].lon1.value = map.getBounds().getNorthEast().lng();
      get_pictures();
    }
    function onMapMove() {
      //map.setCenter(map.getCenter());
      updateStatus();
    }
    function onMapZoom(oldZoom, newZoom) {
      //map.setCenter(map.getCenter(),newZoom)
      updateStatus();
    }
    function load() {
      if (GBrowserIsCompatible()) {
        var mapOptions = {
        zoom: 6,
        center: new google.maps.LatLng(41.879786443521795,12.427597045898438),
        mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"),
        mapOptions);
        var weatherLayer = new google.maps.weather.WeatherLayer({
        temperatureUnits: google.maps.weather.TemperatureUnit.CELSIUS
        });
        weatherLayer.setMap(map);
        var cloudLayer = new google.maps.weather.CloudLayer();
        cloudLayer.setMap(map);
        updateStatus();
      }
    }
    </script>

当前map只能在initialize内部访问，让它全局可访问:

window.map = new google.maps.Map(/*.....*/);

此外:getBounds()不能在map完成加载之前返回结果(map是异步加载的，因此你不能立即调用updateStatus())。

你可以观察到tile - loaded-event:

google.maps.event.addListenerOnce(map,'tilesloaded',updateStatus);

但是你似乎也想观察缩放和平移，你可以一次观察所有:

google.maps.event.addListener(map,'bounds_changed',updateStatus);

您没有从getBounds()调用返回任何内容的原因是因为您的map变量不在全局作用域中。试着在你的函数之外声明你的map变量，它应该工作-因为你的getBounds()声明没有错。

所以像…

var map;    //declaring map variable globally
function updateStatus() {
//code..  
}
function onMapMove() {
//code..  
}
function onMapZoom(oldZoom, newZoom) {
//code..
}
function load() {
    //using the global variable
    map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);
}
  • v3不包含GBrowserIsCompatible。
    • 你不应该在同一个页面上包含两个版本的API，除非你知道你在做什么。

  • map.getBounds()在触发bounds_changed事件之前不会返回一个有效值。您可能希望在bounds_changed的事件侦听器中运行updateStatus函数。

    google.maps.event。addListener(map， 'bounds_changed'， updateStatus});

相关文章：