javascript - リーフレット AJAX マップ FitBounds

Question

ロードされた geoJSON ファイルのコンテンツを表示するためにリーフレット マップの境界に適合するソリューションを探しています。

ファイルのロードには、leaflet-ajax を使用します。私はすでにこれを試しましたが、レイヤーの境界を取得する方法がわかりません。表示されたマップセクターを調整して geoJSON ファイルを表示する方法を教えてください。ありがとう。

var geojsonLayer = new L.GeoJSON.AJAX('http://localhost:8080/test.geojson');
geojsonLayer.addTo(this.map);
this.map.fitBounds(geojsonLayer.getBounds());

Answer 1

AJAX は非同期を意味します。そのため、コンテンツが読み込まれる前にfitBounds 呼び出しが実行されます。これを正しく行うには、data:loaded イベントを待ちます。

var geojsonLayer = new L.GeoJSON.AJAX('http://localhost:8080/test.geojson');
geojsonLayer.addTo(this.map);
geojsonLayer.on('data:loaded', function() {
  this.map.fitBounds(geojsonLayer.getBounds());
}.bind(this));

を使用すると、デフォルト.bind(this)でコールバックの this 値が異なるためです。