what3words

application/assets/js/module.js

@@ -424,7 +424,14 @@ const module = (() => {
 
     //show selected marker
     map.setView(markers_collection[index].getLatLng());
-    console.log(markers_collection[index]);
+
+    let marker_latlng = markers_collection[index].getLatLng();
+
+    what3words(marker_latlng.lat, marker_latlng.lng, "76YHEAE5").then(
+      (what3wordsAddress) => {
+        document.querySelector("#what3words").textContent = what3wordsAddress;
+      }
+    );
 
     //popup
     document.querySelector("input#popup").value = "";
@@ -1237,6 +1244,24 @@ const module = (() => {
     return a.toFixed(2);
   };
 
+  let what3words = (lat, lng, key) => {
+    const url = `https://api.what3words.com/v3/convert-to-3wa?coordinates=${lat},${lng}&key=${key}`;
+
+    return fetch(url)
+      .then((response) => response.json())
+      .then((data) => {
+        if (data.words) {
+          return data.words;
+        } else {
+          throw new Error(data);
+        }
+      })
+      .catch((error) => {
+        console.error("Error:", error);
+        return null;
+      });
+  };
+
   return {
     hotline,
     convert_units,
@@ -1262,5 +1287,6 @@ const module = (() => {
     uniqueId,
     parseGPX,
     update_gpx_info,
+    what3words,
   };
 })();

application/index.html

@@ -121,6 +121,13 @@
         remove marker
       </div>
 
+      <h2>What3words</h2>
+      <div class="item" id="what3words" tabindex="3"></div>
+
+
+
+
+
       <h2>Routing</h2>
       <div class="item" data-action="set_marker_route_start" tabindex="3">
         set as start point