Карта с автоматическим панорамированием/центрированием/масштабированием в пределах маркеров JSON, загруженных через .loadURL

В настоящее время у меня есть этот фрагмент кода, который работает так, как я хочу. Я очищаю JSON, который загружается с картой mapbox, загружаю один набор JSON из локального файла и отфильтровываю некоторые точки. Разобрался с этим благодаря предыдущему сообщению.

Теперь я хочу автоматически панорамировать/масштабировать карту, чтобы охватить только видимые маркеры, и мне не повезло. Я пробовал несколько вариантов fitBounds и map.extent и снабжал их map.markerLayer.getGeoJSON или markerLayer.getGeoJSON. Первый выдает консольную ошибку «lat» undefined, которая отправила меня на поиск console.log, и кажется, что когда вы используете loadURL, getGeoJSON больше не возвращает никаких результатов?

Спасибо за помощь. Вот код.

var statestring = String(Request.QueryString("location"));
var map = L.mapbox.map('map', 'aam.map-ryzdcons');

map.markerLayer.setGeoJSON([]);
var markerLayer = L.mapbox.markerLayer()
.loadURL('markers.geojson.txt')
.setFilter(function(f) {
return f.properties['coverage'].toLowerCase().indexOf(statestring.toLowerCase()) > -1 ; })
.addTo(map);

Здесь я попытался поставить map.fitBounds(markerLayer.getBounds()); без успеха и некоторые другие варианты.

  markerLayer.on('mouseover', function(e) {
      e.layer.openPopup();
  });
  markerLayer.on('mouseout', function(e) {
      e.layer.closePopup();
  });

Изменить № 2: я только что попробовал это, доказав свою теорию о том, что getGeoJSON действительно НЕ работает при первой настройке loadURL. Это вроде работает, но не выполняет то, что я хочу, очевидно.

$.getJSON("markers.geojson.txt", function (data) {
map.markerLayer.setGeoJSON(data);                           
map.fitBounds(markerLayer.getBounds());
if (markers.length == '1') {
map.setZoom(8);
}
map.markerLayer.setGeoJSON([]);
});

Отредактируйте № 3, потому что это не позволит мне ответить на мой вопрос еще пару часов:

Ответ таков: нужно дождаться готового события, по крайней мере, в моем случае. Материал в редактировании № 2 перемещен в готовое событие markerLayer.on.

var markers = [];   
markerLayer.on('ready', function(e) {
this.eachLayer(function(marker) { markers.push(marker); });
map.fitBounds(markerLayer.getBounds());
if (markers.length == '1') {
    map.setZoom(8);
    }
//alert(markers.length);
});

javascript leaflet mapbox
person Sputnikk23    schedule 14.11.2013    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Ответ таков: нужно дождаться готового события, по крайней мере, в моем случае. Материал в редактировании № 2 перемещен в готовое событие markerLayer.on.

var markers = [];   
markerLayer.on('ready', function(e) {
this.eachLayer(function(marker) { markers.push(marker); });map.fitBounds(markerLayer.getBounds());
if (markers.length == '1') {
map.setZoom(8);
}
//alert(markers.length);
});
person Sputnikk23    schedule 15.11.2013