From 0ead8a6c32e55fb2989e932ff0d5a20f88809fd9 Mon Sep 17 00:00:00 2001 From: user Date: Sun, 7 Apr 2024 03:03:16 +0200 Subject: show all stores, and their respective polygons --- src/static/main.js | 50 ++++++++++++++++++++++++++++++++++++++++++++++---- 1 file changed, 46 insertions(+), 4 deletions(-) (limited to 'src/static/main.js') diff --git a/src/static/main.js b/src/static/main.js index 24d0edf..405f455 100644 --- a/src/static/main.js +++ b/src/static/main.js @@ -4,15 +4,46 @@ L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { attribution: '© OpenStreetMap' }).addTo(map); +let known_store_chains; +let icons = {}; + +async function fetchChains() { + const response = await fetch("chains"); + known_store_chains = await response.json(); + + icons["Unknown"] = L.icon({ + iconUrl: 'icons/Unknown.png', + iconSize: [10, 16], + iconAnchor: [16, 16], + }); + + for (let known_store_chain of known_store_chains) { + icons[known_store_chain] = L.icon({ + iconUrl: `icons/${known_store_chain}.png`, + iconAnchor: [8, 8], + }); + } + + fetchShops(); +} function addMarker(shop) { - L.marker([shop.lat, shop.long], {title: shop.name, }).addTo(map); + let icon; + + if (known_store_chains.includes(shop.brand)){ + icon = icons[shop.brand]; + } else { + icon = icons["Unknown"]; + } + + L.marker([shop.lat, shop.long], { + title: shop.name, + icon: icon, + }).addTo(map); } function addPolygon(polygon) { L.polygon(polygon, {color: 'red'}).addTo(map); - - console.log(polygon.coordinates) } @@ -22,11 +53,22 @@ async function fetchShops() { shops.forEach((shop) => addMarker(shop)); } -fetchShops() async function fetch_voronoi_polygons() { const response = await fetch("voronoi_polygons.json"); const voronoi_polygons = await response.json(); voronoi_polygons.forEach((polygon) => addPolygon(polygon)); } + +function update(){ + if (map.getZoom() >= 14){ + //console.log('update') + } +} + +map.on('moveend', function() { + update() +}); + +fetchChains() fetch_voronoi_polygons() \ No newline at end of file -- cgit v1.2.3