InfoBoxを使用しているときにJQuery-UI-Mapが生成されたマップをターゲットにする方法

StackOverflow https://stackoverflow.com//questions/12696292

質問

jquery-ui-map にこのようなGoogleマップインスタンスを作成します。

$('#CHMap').gmap({
  mapTypeControl : false
}).bind('init', function(evt, map) {
  log("Map initilised");
});
.

その後スクリプトの他の場所で InfoBox データで入力されたいくつかのスタイル可能な情報ボックスを追加することは、次のように:

var boxText = document.createElement("div");
var ib = new InfoBox(myOptions); //myOptions can be ignored for this example

$.each(data, function(name, value) {
  $('#CHMap').gmap('addMarker', {
    id:value['YourId'],
    'position': value['Latitude']+','+value['Longitude'],
    'bounds': true,
    'icon': '/img/gicon.png'
  }).click(function() {
    boxText.innerHTML = "hello";
    ib.setContent(boxText);
    ib.open(map, this);
  });
});
.

'data'は、GeoLocationサービスから返されたオブジェクトです。GMAPが最初に作成されたときに、上記の「init」関数内に上記の「addmarker」コードを配置すると、InfoBoxは罰金を表示します。私が他の場所で 'AddMarker'コードを使うとき、私は "Concaughtの参照エラー:マップは定義されていない"エラーが発生しました。

「マップ」を正しく参照するにはどうすればいいですか。GMAPが何も返すことを示唆しているようにvar map = $('#CHMap').gmap({//options});を実行できないようです。

役に立ちましたか?

解決

あなたはできると思います

var map = $('#CHMap').gmap();
.

OPから注意してください。最新のプラグインの正しい方法は次のとおりです。

var map = $('#CHMap').gmap('get', 'map');
.

API

で何も返すと言っているのところはわかりません

マップにアクセスする必要があるときは、マップタイルがこのようにロードされるまで待機するGoogle Mapsイベントリスナ内のコードを追加できます。

GmapsがGoogleからAsyncをフェッチしているので、このようなことがない限り、あなたがそれを呼び出すときにいつもそこにいると確信することはできません。

google.maps.event.addListener(YOUR_GOOGLE_MAPS_INSTACE, 'tilesloaded', function() {
       // put your initialization code in here.
}
.

だからマップが完全にロードされた後にのみ実行されます。

ブラジルからの歓声!

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top