У меня проблема с Leaflet Control Search, я тестирую на C9.io, использую Laravel 5.2, я пытаюсь найти слой L.geojson, но все, что он приходит, это «Location not Found», и консоль выдает ошибку:
«Невозможно прочитать свойство ‘call’ из undefined»
У меня есть глобальные переменные, которые содержат карту, слои L.geojson и плитки.
var map, allcalls, mapquest;
mapquest = new L.TileLayer("http://{s}.mqcdn.com/tiles/1.0.0/osm/{z}/{x}/{y}.png", {
maxZoom: 18,
subdomains: ["otile1", "otile2", "otile3", "otile4"],
});
map = new L.Map('map', {
center: new L.LatLng(39.90973623453719, -93.69140625),
zoom: 3,
layers: [mapquest]
});
var promise = $.getJSON("leaflet_php/get_users.php");
promise.then(function(data) {
allcalls = L.geoJson(data, {
onEachFeature: function (feature, layer) {
layer.bindPopup(feature.properties.fn + '<br>' +feature.properties.gender + '<br>' + feature.properties.addr + '<br>'+ feature.properties.city );
}
});
map.fitBounds(allcalls.getBounds(), {
padding: [20, 20]
});
allcalls.addTo(map);
});
Затем я запускаю L.control.search, и он отображается на карте, но когда я ищу, я не получаю никаких результатов, gif загрузчика никогда не останавливается, и я получаю консольную ошибку «Не удается прочитать свойство ‘call’ of undefined»
var controlSearch = new L.Control.Search({
layer: allcalls,
position:'topleft',
propertyName: 'city',
});
map.addControl( controlSearch );
Я генерирую JSON с помощью https://github.com/bmcbride/PHP-Database-GeoJSON. Мой Json имеет не менее 1000 функций, каждая функция имеет 30 свойств. Так что это сокращенная версия. Это образец JSON, который я получаю:
{"type":"FeatureCollection","features":[{"type":"Feature","geometry": {"type":"Point","coordinates":[-80.191626,26.339826]},"properties":{"id":1,"fn":"SAMUEL","mi":null,"ln":"STANTON","name_pre":"MR","addr":"9 HONEYSUCKLE DR","apt":null,"city":"AMELIA","st":"OH","zip":45102,"z4":9722,"dpc":99,"fips_cty":25,"latitude":26.339826,"longitude":-80.191626,}},
Любая помощь с благодарностью. Заранее спасибо.
Вы должны создать экземпляр L.Control.Search
в обратном вызове Promise или, по крайней мере, используйте setLayer()
метод в этом обратном вызове.
Похоже, у вас есть классическая асинхронная проблема: вы инициируете запрос AJAX (через JQuery’s getJSON
), который назначит значение вашего allcalls
переменная после разрешения.
Параллельно вы создаете L.Control.Search
и указать allcalls
в качестве группы слоев, в которой необходимо выполнить поиск. Однако в то время AJAX все еще обрабатывает (т.е. не разрешается), поэтому allcalls
все еще не назначен (т.е. undefined
).
Поэтому ваш элемент управления поиском ничего не знает о L.geoJson
группа слоев, созданная позже в разрешении AJAX.
Других решений пока нет …