0

JavaScript に慣れるために Google Maps API をいじっています。私はひどいプログラマーなので、許してください。

次のコードが機能しない理由がよくわかりません。ここで JSFiddle を確認できます: http://jsfiddle.net/m9QLx/

var map;

function initialize() {

var myOptions = {
      center : new google.maps.LatLng(34.053228, -118.259583),
      zoom   : 11,
      zoomControl: true,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    },

map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

};

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

map.panTo(new google.maps.LatLng(37.4569, -122.1569));

すべて正常に動作しますが、panTo メソッドが機能しない理由がわかりません。すべての関数の外側で var マップを宣言するとグローバルになり、initialize() 関数の外側で map を設定します。この initialize() 関数 panTo メソッドは機能しません。マップは未定義のようです。

私は初歩的な間違いを犯していると確信していますが、答えが見つかりません（間違ったことをグーグルで検索していると確信しています）。

誰かが私の正気を救うことができればありがとう.

4

1 に答える 1

0

マップが初期化される前に map.panTo メソッドを使用しようとしています。

これにより、ページが「ロード」イベントを発生させたときに初期化関数が実行されます (完全な DOM/ページがレンダリングされています)。

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

これは、「load」イベントが発生してマップ変数が初期化される前に、すぐに実行されます。

map.panTo(new google.maps.LatLng(37.4569, -122.1569));

したがって、何もしません。マップが初期化された後、初期化関数に移動する必要があります。

var map;

function initialize() {

var myOptions = {
      center : new google.maps.LatLng(34.053228, -118.259583),
      zoom   : 11,
      zoomControl: true,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
map.panTo(new google.maps.LatLng(37.4569, -122.1569));    
};

google.maps.event.addDomListener(window, 'load', initialize);
于 2013-11-03T13:05:15.430 に答える