Название в значительной степени говорит о том, что я собираюсь делать.
Я использую Firebase как серверную часть для маркеров на карте и использую метод on('child_added')
для их отслеживания. Для каждого узла в определенном месте в базе данных on('child_added')
сработает один раз.
Это также относится к создаваемым новым узлам, поэтому это идеально подходит для асинхронного добавления новых маркеров на карту по мере их добавления в базу данных.
Чтобы отобразить их на карте, mapbox GL требует, чтобы я преобразовал данные в geojson
, создал источник, а затем добавил этот источник в слой. Код ниже показывает это и фактически отображает маркеры на карте.
markersRef.on('child_added', function(childSnapshot) { //fires once for every child node
var currentKey = childSnapshot.key; //the key of current child
var entry = childSnapshot.val(); //the value of current child
//creates a geojson object from child
var geojson = {
"type": "FeatureCollection",
"features": [{
"type": "Feature",
"geometry": {
"type": "Point",
"coordinates": [entry.position.long, entry.position.lat]
}
}],
"properties": {
title: entry.title,
text: entry.text
}
};
//creates a source with the geojson object from above
map.addSource(currentKey, { //currentKey is the name of this source
"type": "geojson",
"data": geojson,
cluster: true //clusters the points in this source
});
//adds the source defined above to a layer that will be displayed on a map
map.addLayer({
"id": currentKey, // Sets id as current child's key
"source": currentKey, // The source layer defined above
});
});
Проблема в том, что маркеры будут в отдельных источниках, поэтому они будут отображаться на разных слоях. Поэтому я не могу их объединить или, например, поиск по ним.
Я ищу способ добавить источник к существующему слою. Это позволило бы мне создать слой вне метода on('child_added')
, а затем добавить источники к этому слою.
Я просмотрел документы GL mapbox, но не могу найти там ничего, что позволило бы мне это сделать. В этом отношении он кажется очень ограниченным по сравнению с mapbox js.
Я считаю это очень важной особенностью и не понимаю, почему это невозможно. Я надеюсь, что у некоторых из вас есть обходной путь или способ добиться асинхронного добавления маркеров на карту в mapbox GL.