nicolo/caprigis
1
0
Fork 0
Code Issues 3 Pull Requests Packages Projects Releases Wiki Activity

Marker coords from DB + local cache

Browse Source
This commit is contained in:
Nicolò P. 2024-06-13 11:18:32 +02:00
parent c4e5c463c4
commit 94b65f0312
1 changed files with 43 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

55
js/caprigis.js
View File

@ -87,13 +87,29 @@ GIS.initMap = async function (mapId, zoomLevel = this.INIT_ZOOM) {
)
.addTo(map);
sitesGroup.eachLayer(layer => {
const marker = L.marker(layer.getBounds().getCenter())
.addTo(map);
marker.on('click', async () => {
const data = await GIS._fetchData(layer.id);
UI.openModal(data);
});
sitesGroup.eachLayer(async layer => {
const fromStorage = localStorage.getItem(layer.id);
let data = {};
let coords = layer.getBounds().getCenter();
if (fromStorage !== undefined) {
try {
data = JSON.parse(fromStorage);
const lat = data?.lat ?? coords[0];
const lon = data?.lon ?? coords[1];
coords = [lat, lon];
} catch (error) {
console.log(error);
}
} else {
data = await GIS._fetchData(layer.id);
}
const marker = L.marker(coords)
.addTo(map)
.bindTooltip(Object.keys(archeo).find(k => archeo[k] === layer))
.openTooltip();
marker.on('click', () => UI.openModal(data));
});
// TODO Horrible?
@ -147,12 +163,16 @@ GIS.initLayers = async function(map) {
* @param {boolean} popup Should the features have a popup?
*/
GIS.loadLayer = async function (geoJSON, options, popup = true) {
const data = await fetch(`${BASE_URL}/geojson/${geoJSON}`)
const geo = await fetch(`${BASE_URL}/geojson/${geoJSON}`)
.then(res => res.json())
.catch(error => console.error(`Can't load layer ${geoJSON}. Reason: ${error}`));
const layerId = geoJSON.replace('.geojson', '');
this.cacheDBData(layerId);
// Show data from feature in popUp?
const layer = new L.geoJson(data, {
const layer = new L.geoJson(geo, {
style: function () {
let style = options;
return style;
@ -163,7 +183,10 @@ GIS.loadLayer = async function (geoJSON, options, popup = true) {
}
else {
layer.on("click", async () => {
const data = await GIS._fetchData(geoJSON.replace('.geojson', ''));
const fromStorage = localStorage.getItem(layerId);
const data = fromStorage !== undefined ?
JSON.parse(fromStorage) :
await GIS._fetchData(layerId);
UI.openModal(data);
});
}
@ -172,6 +195,15 @@ GIS.loadLayer = async function (geoJSON, options, popup = true) {
return layer;
}
/**
* Cache data from DB in local storage
* for a given layer
* @param {string} layerId
*/
GIS.cacheDBData = async function (layerId) {
const data = await this._fetchData(layerId);
localStorage.setItem(layerId, JSON.stringify(data));
}
/**
* Generate proper content for features popup
* @todo Hard-coded names!!
@ -198,8 +230,7 @@ GIS.featurePopup = function (layerName, feature) {
return content[layerName];
}
/**
* Fetch data from DB using API
* @todo Actually implement it...
* Fetch data from API
* @param {string} recordId
*/
GIS._fetchData = async function (recordId) {