Update map.html

rly0nheart · Nov 6, 2023 · 8fa7ff0 · 8fa7ff0
1 parent 820d192
commit 8fa7ff0
Showing 1 changed file with 21 additions and 31 deletions.
diff --git a/orbis_unum/templates/map.html b/orbis_unum/templates/map.html
@@ -3,7 +3,6 @@
 <head>
   <meta charset="utf-8"/>
   <title>🗺️ {{ current_user }}@orbis - {{ map_name }}</title>
-
   <!-- Include the Leaflet CSS library -->
   <link rel="stylesheet" href="https://unpkg.com/[email protected]/dist/leaflet.css"/>
   <style>
@@ -18,53 +17,44 @@
   </style>
 </head>
 <body>
-  <!-- Create a div where the map will be placed -->
   <div id="map"></div>
-
-  <!-- Include the Leaflet JavaScript library -->
   <script src="https://unpkg.com/[email protected]/dist/leaflet.js"></script>
-
   <script>
-  // Initialize the map and set its initial view to coordinates [0, 0] at zoom level 2
-  var map = L.map('map').setView([0, 0], 2);
+    // Initialize the map and set its initial view to coordinates [0, 0] at zoom level 2
+    var map = L.map('map').setView([0, 0], 2);
 
-  // Add the Esri World Imagery tile layer to the map as the satellite layer
-  var mapLink = '<a href="http://www.esri.com/">Esri</a>';
-  var wholink = 'i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community';
-  L.tileLayer(
+    // Add the Esri World Imagery tile layer to the map as the satellite layer
+    var mapLink = '<a href="http://www.esri.com/">Esri</a>';
+    var wholink = 'Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community';
+    L.tileLayer(
       'https://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
       attribution: '&copy; '+mapLink+', '+wholink,
       maxZoom: 18,
-  }).addTo(map);
+    }).addTo(map);
 
-  // Create a popup
-  var popup = L.popup();
+    // Create a popup
+    var popup = L.popup();
 
-  // Iterate over the list of location data and create a marker for each location
-  {% for data in map_data %}
-  L.marker([{{ data.location.lat }}, {{ data.location.lon }}])
+    {% for data in map_data %}
+    L.marker([{{ data.location.lat }}, {{ data.location.lon }}])
       .bindPopup('<i>{{ data.location.display_name }}</i>' +
                  '<br><b>🛰️ Earth:</b> <a href="https://earth.google.com/web/@{{ data.location.lat }},{{ data.location.lon }},89.06331136a,12094.0505788d,1y,1.97597436h,60t,-0r/data=KAI" target="_blank">View</a>' +
                  '<br><b>🏞️ Images:</b> <a href="https://google.com/search?tbm=isch&q={{ data.location.display_name }}" target="_blank">Show</a>' +
                  '<br><b>🪟 Street View:</b> <a href="https://www.google.com/maps/@?api=1&map_action=pano&viewpoint={{ data.location.lat }},{{ data.location.lon }}" target="_blank">View</a>' +
                  '{% if data.ip_address %}<br><b>🖥️ IP Address:</b> {{ data.ip_address }}{% endif %}' +
                  '<br><b>🌐 Latitude:</b> {{ data.location.lat }}' +
                  '<br><b>🌐 Longitude:</b> {{ data.location.lon }}')
-      .addTo(map)
-      .openPopup();
-  {% endfor %}
-
-  // Function to handle clicks on the map
-  function onMapClick(e) {
-    popup
-    .setLatLng(e.latlng)
-    .setContent("🖱️ You clicked the map at " + e.latlng.toString())
-    .openOn(map);
-  }
-
-  // Add a click event listener to the map
-  map.on('click', onMapClick);
+      .addTo(map);
+    {% endfor %}
+
+    function onMapClick(e) {
+      popup
+        .setLatLng(e.latlng)
+        .setContent("🖱️ You clicked the map at " + e.latlng.toString())
+        .openOn(map);
+    }
 
+    map.on('click', onMapClick);
   </script>
 </body>
 </html>