From 9f57751fb4a5c14d861fd0d158bc8ff68fc727dc Mon Sep 17 00:00:00 2001
From: jshjelse <jshjelse@stud.ntnu.no>
Date: Sat, 30 Sep 2023 14:59:17 +0200
Subject: [PATCH] Teste ut
---
index.html | 4 ++--
javascript/buffer.js | 24 ++++++++++++++++--------
javascript/geoJSON.js | 4 ----
javascript/leafletLayerControl.js | 11 +++++++++++
4 files changed, 29 insertions(+), 14 deletions(-)
diff --git a/index.html b/index.html
index 5bee1db..8282586 100644
--- a/index.html
+++ b/index.html
@@ -8,7 +8,8 @@
<!-- Leaflet css -->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" integrity="sha256-p4NxAoJBhIIN+hmNHrzRCf9tD/miZyoHS5obTRR9BMY=" crossorigin="" />
-
+
+ <!-- Turfjs -->
<script src='https://unpkg.com/@turf/turf@6/turf.min.js'></script>
</head>
@@ -195,7 +196,6 @@
<script src="javascript/buffer.js"></script>
<!-- Imported js -->
- <!--<script src='https://unpkg.com/@turf/turf@6/turf.min.js'></script>-->
<!-- <script src="https://unpkg.com/shpjs@latest/dist/shp.js"></script> -->
</body>
diff --git a/javascript/buffer.js b/javascript/buffer.js
index 62685b6..64294c8 100644
--- a/javascript/buffer.js
+++ b/javascript/buffer.js
@@ -5,20 +5,28 @@ https://turfjs.org/docs/
// Fyller select med alternativ:
-var s = document.getElementById("bufferSelect");
+var select = document.getElementById("bufferSelect");
-s.options.lenght = 0;
+select.options.lenght = 0;
for (key in overlayMaps) {
- s.add(new Option(key, overlayMaps[key]));
+ select.add(new Option(key, overlayMaps[key]));
}
function makeBuffer() {
- var layer = document.getElementById("bufferSelect").value;
- var distance = parseFloat(document.getElementById("bufferDistance").value) / 10^3;
+ var layer = overlayMaps[document.getElementById("bufferSelect").value];
+ var distance = parseFloat(document.getElementById("bufferDistance").value);
var name = document.getElementById("bufferName").value;
-
- var buffer = L.geoJSON(turf.buffer(layer, distance, {units: "kilometers"})).addTo(map);
- overlayMaps[name] = buffer;
+ var object = layer.toGeoJSON();
+ console.log(JSON.stringify(object));
+
+ var buffer = turf.buffer(layer.toGeoJSON(), distance, {units: "meters"});
+ var newLayer = L.geoJSON(buffer);
+
+ overlayMaps[name] = newLayer;
+
+ updateSidebar();
+
+ newLayer.addTo(map);
}
\ No newline at end of file
diff --git a/javascript/geoJSON.js b/javascript/geoJSON.js
index 3092770..6883923 100644
--- a/javascript/geoJSON.js
+++ b/javascript/geoJSON.js
@@ -80,10 +80,6 @@ var test2 = L.geoJSON();
test1.addData(U);
test2.addData(TC);
-var point = turf.point([10.403787, 63.420031]);
-var buffered = turf.buffer(point, 500, {units: "meters"});
-var test3 = L.geoJSON(buffered).addTo(map);
-
// Det jeg skal ha med i ferdig versjon:
var Arealdekke = L.geoJSON();
diff --git a/javascript/leafletLayerControl.js b/javascript/leafletLayerControl.js
index 30913cc..7cbc0be 100644
--- a/javascript/leafletLayerControl.js
+++ b/javascript/leafletLayerControl.js
@@ -36,3 +36,14 @@ function handleLayer(layer) {
document.getElementById(layer.innerHTML).style.backgroundColor = "green";
}
}
+
+function updateSidebar() {
+ for (key in overlayMaps) {
+ var layerButton = document.createElement("div");
+ layerButton.innerHTML = "<button id='" + key + "' class='sidebarButton' onclick=handleLayer(" + key + ") />" + key;
+
+ container = document.getElementById("layers");
+ container.appendChild(layerButton);
+ container.appendChild(document.createElement("br"));
+ }
+}
--
GitLab