diff --git a/src/assets/brusov.png b/public/markers/brusov.png similarity index 100% rename from src/assets/brusov.png rename to public/markers/brusov.png diff --git a/src/assets/ostrovskiy.png b/public/markers/ostrovskiy.png similarity index 100% rename from src/assets/ostrovskiy.png rename to public/markers/ostrovskiy.png diff --git a/src/assets/prishvin.png b/public/markers/prishvin.png similarity index 100% rename from src/assets/prishvin.png rename to public/markers/prishvin.png diff --git a/src/KartaPage.tsx b/src/KartaPage.tsx index f956ffe..ad517f2 100644 --- a/src/KartaPage.tsx +++ b/src/KartaPage.tsx @@ -16,11 +16,8 @@ import Fuse from "fuse.js"; import mapstyle from "./assets/basemap-mapbox.json"; import plus from "./assets/plus.png"; import minus from "./assets/minus.png"; - import pin from "./assets/pin.png"; -import prishvin from "./assets/prishvin.png"; -import ostrovskiy from "./assets/ostrovskiy.png"; -import brusov from "./assets/brusov.png"; + export function KartaPage() { const mapRef = useRef(null); @@ -35,22 +32,16 @@ export function KartaPage() { // Load icons const handleMapLoad = (e) => { - const icons = ["pin", "prishvin", "ostrovskiy", "brusov"]; const pinImage = new Image(); pinImage.src = pin; pinImage.onload = () => mapRef.current.addImage("pin-marker", pinImage); - const prishvinImage = new Image(); - prishvinImage.src = prishvin; - prishvinImage.onload = () => - mapRef.current.addImage("prishvin-marker", prishvinImage); - const ostrovskiyImage = new Image(); - ostrovskiyImage.src = ostrovskiy; - ostrovskiyImage.onload = () => - mapRef.current.addImage("ostrovskiy-marker", ostrovskiyImage); - const brusovImage = new Image(); - brusovImage.src = brusov; - brusovImage.onload = () => - mapRef.current.addImage("brusov-marker", brusovImage); + + const icons = initial ? ["prishvin", "ostrovskiy", "brusov"] : []; + icons.map(i => { + const iconImage = new Image(); + iconImage.src = `./markers/${i}.png` + iconImage.onload = () => mapRef.current.addImage(`${i}-marker`, iconImage); + }) }; // Load articles @@ -58,6 +49,7 @@ export function KartaPage() { fetch(`${host}/api/articles?populate=*`) .then((r) => r.json()) .then((d) => { + console.log(d.data) setInitial(d.data); setArticles(d.data); });