Diff of /src/map-script.js [000000] .. [d7fa72]

Switch to side-by-side view

--- a
+++ b/src/map-script.js
@@ -0,0 +1,68 @@
+let markersArray = [];
+const markersLayer = L.layerGroup();
+const overlayMaps = { 'Markers': markersLayer };
+const layerControl = L.control.layers(null, overlayMaps).addTo(map);
+map.addLayer(markersLayer)
+function createMarker(xPos, yPos) {
+	let counter = markersArray.length+1
+	let newMarker = L.marker([xPos, yPos]).addTo(markersLayer).bindPopup(counter + " x " + xPos + " y " + yPos)
+	console.log("New Marker" + counter + " x " + xPos + " y " + yPos)
+	markersArray.push(newMarker)
+	document.getElementById('markArrLength').innerHTML = markersArray.length
+	//console.log(newMarker)
+}
+document.getElementById('mapClick').addEventListener('change', e => {
+	if (document.getElementById('mapClick').checked){
+		map.addEventListener('click', createMarkerOnClick)
+	} else {
+		map.removeEventListener('click', createMarkerOnClick)
+		}
+	})
+function createMarkerOnClick(e) {
+		let lat = Math.round(e.latlng.lat);
+		let lng = Math.round(e.latlng.lng);
+	createMarker(lat, lng)
+}
+function showCoord(xPos, yPos) {
+  map.flyTo([xPos, yPos], map.getZoom())
+}
+function flyToMarker(arrayIndex) {
+	let { lat, lng } = markersArray.at(arrayIndex-1)._latlng;
+	showCoord(lat, lng)
+}
+function showMarkArr() {
+	let newTable = document.createElement('div');
+  newTable.setAttribute("id", "popup-list");
+  let table = document.createElement('table');
+  newTable.appendChild(table)
+	let counter = 1;
+	for (marker of markersArray) {
+		let { lat, lng } = marker._latlng;
+		let tr = table.insertRow();
+		let tdNum =  tr.insertCell();
+		tdNum.appendChild(document.createTextNode(counter))
+		counter++;
+		let tdX = tr.insertCell();
+		tdX.appendChild(document.createTextNode(lat))
+		let tdY = tr.insertCell();
+		tdY.appendChild(document.createTextNode(lng))
+	}
+	document.body.appendChild(newTable)
+}
+map.addEventListener('mousemove', (event) => {
+	let lat = Math.round(event.latlng.lat);
+	let lng = Math.round(event.latlng.lng);
+	document.getElementById('xMouseCoord').innerHTML = lat;
+	document.getElementById('yMouseCoord').innerHTML = lng;
+})
+//
+document.getElementById('showMarkersArr').addEventListener('click', (e) => {
+	if (document.getElementById('showMarkersArr').innerHTML.includes("Show")) {
+		showMarkArr()
+		document.getElementById('showMarkersArr').innerHTML = "Hide markers list";
+	} else {
+		let table = document.getElementById('popup-list')
+		table.remove()
+		document.getElementById('showMarkersArr').innerHTML = "Show markers list";
+	}
+})
\ No newline at end of file