updated parcel meta to match updated endpoint

oklabflensburg · Nov 5, 2024 · db98226 · db98226
1 parent cdc48f7
commit db98226
Showing 1 changed file with 21 additions and 45 deletions.
diff --git a/src/main.js b/src/main.js
@@ -43,7 +43,7 @@ function formatToAreaNumber(number) {
 }
 
 
-function renderBiotopeMeta(data) {
+function renderParcelMeta(data) {
   if (currentLayer) {
     map.removeLayer(currentLayer)
   }
@@ -62,20 +62,20 @@ function renderBiotopeMeta(data) {
 
   let detailOutput = ''
 
-  if (data['district'] !== null) {
-    detailOutput += `<li><strong>Landkreis</strong><br><ul>${data['district']}</ul></li>`
+  if (data['parcel_number'] !== null) {
+    detailOutput += `<li><strong>Flurstück</strong><br>${data['parcel_number']}</li>`
   }
 
-  if (data['municipality'] !== null) {
-    detailOutput += `<li><strong>Gemeinde</strong><br>${data['municipality']}</li>`
+  if (data['field_parcel_number'] !== null) {
+    detailOutput += `<li><strong>Flur</strong><br>${data['field_parcel_number']}</li>`
   }
 
-  if (data['parcel_number'] !== null) {
-    detailOutput += `<li><strong>Gemarkungsnummer</strong><br>${data['parcel_number']}</li>`
+  if (data['land_parcel_name'] !== null) {
+    detailOutput += `<li><strong>Gemarkung</strong><br>${data['land_parcel_name']}</li>`
   }
 
-  if (data['field_number'] !== null) {
-    detailOutput += `<li><strong>Flurnummer</strong><br>${data['field_number']}</li>`
+  if (data['municipality_name'] !== null) {
+    detailOutput += `<li><strong>Gemeinde</strong><br>${data['municipality_name']}</li>`
   }
 
   if (data['shape_area'] > 0) {
@@ -84,65 +84,42 @@ function renderBiotopeMeta(data) {
   }
 
   const detailList = document.querySelector('#detailList')
-  const ribbonValuableBiotope = document.querySelector('#ribbonElement')
-
-  if (ribbonValuableBiotope) {
-    ribbonValuableBiotope.remove()
-  }
-
-  if (data['valuable_biotope'] !== undefined && data['valuable_biotope'] === 1) {
-    const ribbonElement = document.createElement('div')
-    const ribbonTextNode = document.createTextNode('Wertbiotop')
-
-    ribbonElement.id = 'ribbonElement'
-    ribbonElement.append(ribbonTextNode)
-    ribbonElement.classList.add('ribbon', 'top-2', 'absolute', 'text-base', 'text-zinc-900', 'font-mono', 'bg-emerald-200', 'tracking-normal', 'ps-2.5', 'pe-3.5')
-    detailList.parentNode.insertBefore(ribbonElement, detailList)
-  }
 
-  detailList.innerHTML = detailOutput
+  document.querySelector('#detailList').innerHTML = detailOutput
   document.querySelector('#sidebar').classList.remove('hidden')
   document.querySelector('#sidebar').classList.add('absolute')
   document.querySelector('#about').classList.add('hidden')
   document.querySelector('#sidebarContent').classList.remove('hidden')
 }
 
 
-function cleanBiotopeMeta() {
+function cleanParcelMeta() {
   if (currentLayer) {
     map.removeLayer(currentLayer)
   }
 
-  const detailList = document.querySelector('#detailList')
-  const ribbonValuableBiotope = document.querySelector('#ribbonElement')
-
-  if (ribbonValuableBiotope) {
-    ribbonValuableBiotope.remove()
-  }
-
-  detailList.innerHTML = ''
+  document.querySelector('#detailList').innerHTML = ''
   document.querySelector('#sidebar').classList.add('hidden')
   document.querySelector('#sidebar').classList.remove('absolute')
   document.querySelector('#about').classList.remove('hidden')
   document.querySelector('#sidebarContent').classList.add('hidden')
 }
 
 
-function fetchBiotopeMeta(lat, lng) {
+function fetchParcelMeta(lat, lng) {
   const url = `https://api.oklabflensburg.de/alkis/v1/parcel?lat=${lat}&lng=${lng}`
-  // const url = `http://localhost:8000/alkis/v1/parcel?lat=${lat}&lng=${lng}`
 
   try {
     fetch(url, {
       method: 'GET'
     }).then((response) => response.json()).then((data) => {
-      renderBiotopeMeta(data)
+      renderParcelMeta(data)
     }).catch(function (error) {
-      cleanBiotopeMeta()
+      cleanParcelMeta()
     })
   }
   catch {
-    cleanBiotopeMeta()
+    cleanParcelMeta()
   }
 }
 
@@ -175,29 +152,29 @@ function handleWindowSize() {
 
 document.addEventListener('DOMContentLoaded', function () {
   L.tileLayer('https://tiles.oklabflensburg.de/sgm/{z}/{x}/{y}.png', {
-    maxZoom: 22,
+    maxZoom: 20,
     tileSize: 256,
     attribution: '&copy; <a href="https://www.openstreetmap.org/copyright" target="_blank" rel="dc:rights">OpenStreetMap</a> contributors'
   }).addTo(map)
 
   L.tileLayer('https://tiles.oklabflensburg.de/shalkislot/{z}/{x}/{y}.png', {
     opacity: 0.9,
-    maxZoom: 22,
-    maxNativeZoom: 22,
+    maxZoom: 20,
+    maxNativeZoom: 20,
     attribution: '&copy; <a href="https://www.schleswig-holstein.de/DE/landesregierung/ministerien-behoerden/LVERMGEOSH" target="_blank" rel="dc:rights">GeoBasis-DE/LVermGeo SH</a>/<a href="https://creativecommons.org/licenses/by/4.0" target="_blank" rel="dc:rights">CC BY 4.0</a>'
   }).addTo(map)
 
   map.on('click', function (e) {
     const lat = e.latlng.lat
     const lng = e.latlng.lng
 
-    fetchBiotopeMeta(lat, lng)
+    fetchParcelMeta(lat, lng)
   })
 
   document.querySelector('#sidebarContentCloseButton').addEventListener('click', function (e) {
     e.preventDefault()
 
-    cleanBiotopeMeta()
+    cleanParcelMeta()
   })
 
   document.querySelector('#sidebarCloseButton').addEventListener('click', function (e) {
@@ -210,7 +187,6 @@ document.addEventListener('DOMContentLoaded', function () {
     history.replaceState({ screen: 'home' }, '', '/')
   })
 
-
   const layers = {
     'layer1': L.tileLayer('https://tiles.oklabflensburg.de/nksh/{z}/{x}/{y}.png', {
       opacity: 0.7,