Я использую getJSON для получения данных из базы данных, которые затем отображаю на карте с помощью Leaflet.
Я хочу использовать несколько вызовов getJSON, которые затем отображаю как разные слои на одной карте. Моя проблема в том, как заставить обратный вызов работать с несколькими вызовами geoJSON в функции getData. Или, в качестве альтернативы (я не уверен, какой подход лучше) - наличие нескольких версий функции getData и возможность доступа ко всем из них для формирования слоев.
Для одного getJSON работает следующее:
function getData(callback) {
$.getJSON("getData.php", callback );
}
getData(function(data) {
let markerlist = [];
for (let i = 0; i< data.length; i++) {
let location = new L.LatLng(data[i].siteLat, data[i].siteLon);
let marker = new L.Marker(location, {
icon: myIcon,
title: 'thetitle' });
markerlist.push(marker);
}
let myLayerGroup = L.layerGroup(markerlist) // create the layer
map.addLayer(myLayerGroup); // add the layer to the map
var overlays = {"layername":myLayerGroup};
L.control.layers(baseLayers,overlays).addTo(map);
});
Я пытался следовать Обратный вызов Need возвращает несколько значений в nodejs , который выглядит похожим, но безуспешно.
Я пытался:
function getData(callback) {
let callbackString = {};
$.getJSON("getData.php", callbackString.set1);
$.getJSON("getOtherData.php", callbackString.set2);
callback(null,callbackString);
}
getData(function(data) {
let data1 = data.set1;
let data2 = data.set2;
let markerlist = [];
for (let i = 0; i< data1.length; i++) {
let location = new L.LatLng(data1[i].siteLat, data1[i].siteLon);
let marker = new L.Marker(location, {
icon: myIcon,
title: 'thetitle' });
markerlist.push(marker);
}
let myLayerGroup = L.layerGroup(markerlist) // create the layer
map.addLayer(myLayerGroup); // add the layer to the map
var overlays = {"layername":myLayerGroup};
L.control.layers(baseLayers,overlays).addTo(map);
});
что выдало ошибку TypeError: null is not an object (evaluating 'data.set1')
Я не знаю, с чего начать иметь несколько версий getData, а затем получить доступ ко всей информации в функции данных.
Этот код
let callbackString = {};
$.getJSON("getData.php", callbackString.set1);
$.getJSON("getOtherData.php", callbackString.set2);
callback(null,callbackString);
.set1
и .set2
будут неопределенными, потому что вы только что создали callbackString
как пустой объект! Я думаю, вы неправильно поняли цель второго аргумента getJSON
... это данные, которые в запросе являются послал
Вы также вызываете обратный вызов с первым аргументом как null - но вы пытаетесь использовать getData как
getData(function(data) { ...
следовательно, data
всегда будет null
Кроме того, $ .getJSON - это асинхронный, и ваш код не ждет завершения запроса, поэтому у вас не будет возможности получить доступ к результатам.
Возможно это поможет
function getData(callback) {
$.when($.getJSON("getData.php"), $.getJSON("getOtherData.php")).then(function(set1, set2) {
callback({set1:set1, set2:set2});
});
}
однако, если вам нужна правильная обработка ошибок, вы можете сделать что-то вроде
function getData(callback) {
$.when($.getJSON("getData.php"), $.getJSON("getOtherData.php"))
.then(function(set1, set2) {
callback(null, {set1:set1, set2:set2});
})
.catch(function(err) {
callback(err);
});
}
getData(function(err, data) {
if (err) {
//handle error
} else {
let data1 = data.set1;
let data2 = data.set2;
let markerlist = [];
...
...
}
});
Лично, поскольку $.getJSON
возвращает обещание (ну, jQuery-версию обещания), я с большей вероятностью напишу такой код:
const getData = () => Promise.all([$.getJSON("getData.php"), $.getJSON("getOtherData.php")]);
getData()
.then(([data1, data2]) => { // note that data1, data2 are now the arguments to the function
let markerlist = [];
for (let i = 0; i< data1.length; i++) {
...
...
}
})
.catch(err => {
// handle errors here
});
Спасибо - я выбрал версию Promise внизу, и у меня она сработала. Вы определенно правы, что я неправильно понял второй аргумент getJSON -> Я следовал примеру и, поскольку он работал, я использовал его.
$.getJSON("getData.php", callbackString.set1);
...set1
будет неопределенным, потому что вы только что создалиcallbackString
как пустой объект! Я думаю, вы неправильно поняли цель второго аргумента getJSON ... это данные послал в запросе