diff --git a/public/data/pins.csv b/public/data/pins.csv index 52d4e1656b262f10dfb4aac2caa99169729f69f1..5ea9a26177e399c9a9eacdf57da4494de6d9ce19 100644 --- a/public/data/pins.csv +++ b/public/data/pins.csv @@ -1,3 +1,3 @@ -lat,lng,name,color,marker_type -48.773330,9.181970,Muhammad's first study area,#0000ff,muhammad -48.780000,9.175000,Another study area,#ff0000,type2 +lat,lng,name,color +48.773330,9.181970,Muhammad's first study area,#0000ff +48.780000,9.175000,Another study area,#ff0000 diff --git a/public/images/muhammad.png b/public/images/muhammad.png deleted file mode 100644 index 9babf78d36d77bce9e10c135db677c46d94ce2fc..0000000000000000000000000000000000000000 Binary files a/public/images/muhammad.png and /dev/null differ diff --git a/public/index2.html b/public/index2.html deleted file mode 100644 index bf29cde809e298f818351c8a5e03c4b710e9853f..0000000000000000000000000000000000000000 --- a/public/index2.html +++ /dev/null @@ -1,74 +0,0 @@ -<!DOCTYPE html> -<html lang="en"> -<head> - <meta charset="UTF-8"> - <meta name="viewport" content="width=device-width, initial-scale=1.0"> - <title>Study Areas Map</title> - <link rel="stylesheet" href="https://unpkg.com/leaflet/dist/leaflet.css" /> - <script src="https://unpkg.com/leaflet/dist/leaflet.js"></script> - <script src="https://cdnjs.cloudflare.com/ajax/libs/PapaParse/5.3.0/papaparse.min.js"></script> - <style> - html, body { - height: 100%; - margin: 0; - padding: 0; - } - - #map { - height: 100vh; - width: 100vw; - } - </style> -</head> -<body> - <div id="map"></div> - - <script> - const map = L.map('map').setView([48.78039307145523, 9.172929033104959], 13); - - // Add OSM base map - L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { - maxZoom: 19, - }).addTo(map); - - // Define custom icons for different marker types - const icons = { - muhammad: L.icon({ - iconUrl: 'https://transfer.hft-stuttgart.de/gitlab/hire-promotionskolleg-team/study-areas-maps/-/raw/master/public/images/muhammad.png', - iconSize: [32, 32], - iconAnchor: [16, 32], - popupAnchor: [0, -32] - }) - }; - - // Function to load pins from CSV and add them to the map - function loadPins() { - console.log("Attempting to load CSV file..."); - Papa.parse('https://transfer.hft-stuttgart.de/gitlab/hire-promotionskolleg-team/study-areas-maps/-/raw/master/public/data/pins.csv', { - download: true, - header: true, - complete: function(results) { - console.log("CSV file loaded:", results); - results.data.forEach(pin => { - if (pin.lat && pin.lng && pin.name && pin.color) { - const marker = L.marker([parseFloat(pin.lat), parseFloat(pin.lng)], { - icon: customIcon // Use the custom icon here - }).addTo(map); - - marker.bindPopup(`<b>${pin.name}</b>`); - } else { - console.warn("Invalid pin data:", pin); - } - }); - }, - error: function(error) { - console.error("Error loading CSV file:", error); - } - }); - } - - // Call the function to load pins from the CSV - loadPins(); - </script> -</body> -</html>