diff --git a/public/images/marker-type1.png b/public/images/muhammad.png similarity index 100% rename from public/images/marker-type1.png rename to public/images/muhammad.png diff --git a/public/index2.html b/public/index2.html index 5997bde39686ea09139c58b7eaa303d6400bd7be..600848aff33e4cb4bc81565adec0067226fe2b9a 100644 --- a/public/index2.html +++ b/public/index2.html @@ -31,13 +31,45 @@ maxZoom: 19, }).addTo(map); - // Define custom icon - const customIcon = L.icon({ - iconUrl: 'https://transfer.hft-stuttgart.de/gitlab/hire-promotionskolleg-team/study-areas-maps/-/raw/master/public/images/marker-type1.png', // Path to your custom marker image - iconSize: [32, 32], // Size of the icon - iconAnchor: [16, 32], // Point of the icon which will correspond to marker's location - popupAnchor: [0, -32] // Point from which the popup should open relative to the iconAnchor - }); + // Define custom icons for different marker types + const icons = { + type1: L.icon({ + iconUrl: 'images/muhammad.png', + iconSize: [32, 32], + iconAnchor: [16, 32], + popupAnchor: [0, -32] + }), + type2: L.icon({ + iconUrl: 'images/marker-type2.png', + iconSize: [32, 32], + iconAnchor: [16, 32], + popupAnchor: [0, -32] + }), + type3: L.icon({ + iconUrl: 'images/marker-type3.png', + iconSize: [32, 32], + iconAnchor: [16, 32], + popupAnchor: [0, -32] + }), + type4: L.icon({ + iconUrl: 'images/marker-type4.png', + iconSize: [32, 32], + iconAnchor: [16, 32], + popupAnchor: [0, -32] + }), + type5: L.icon({ + iconUrl: 'images/marker-type5.png', + iconSize: [32, 32], + iconAnchor: [16, 32], + popupAnchor: [0, -32] + }), + type6: L.icon({ + iconUrl: 'images/marker-type6.png', + iconSize: [32, 32], + iconAnchor: [16, 32], + popupAnchor: [0, -32] + }) + }; // Function to load pins from CSV and add them to the map function loadPins() {