1

マッシュアップ ページのコードを Google マップ 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>
4

3 に答える 3

2

現在、マップは初期化内でのみアクセス可能であり、グローバルにアクセス可能にします。

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

さらに、getBounds()は、マップのロードが完了する前に結果を返すことはできません(マップは非同期でロードされるため、updateStatus()をすぐに呼び出すことはできません)。

tilesloaded-eventを観察できます。

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

ただし、ズームとパンも観察したいように見えるので、一度にすべてを観察できます。

google.maps.event.addListener(map,'bounds_changed',updateStatus);
于 2013-01-20T22:44:12.633 に答える
0

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);
}
于 2013-01-20T22:45:06.093 に答える
0
  • v3 には GBrowserIsCompatible が含まれていません。
  • 何をしているのかわからない限り、同じページに両方のバージョンの API を含めるべきではありません。
  • map.getBounds() は、bounds_changed イベントが発生するまで有効な値を返しません。bounds_changed のイベント リスナー内で updateStatus 関数を実行することをお勧めします。

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

于 2013-01-20T22:46:46.187 に答える