diff --git a/main.js b/main.js
index 456c6fc2..570bec49 100644
--- a/main.js
+++ b/main.js
@@ -1,5 +1,4 @@
/* global L Papa */
-
// PASTE YOUR URLs HERE
// these URLs come from Google Sheets 'shareable link' form
// the first is the geometry layer and the second the points
@@ -7,15 +6,11 @@ let geomURL =
"https://docs.google.com/spreadsheets/d/e/2PACX-1vS4sQJDfJGptqDkY-eNDqcR1xJ_YH-X0qb9BKnYvSf34ArSCPE5ducm_-FaG1cNcO1AgQjsjGxie8Fi/pub?gid=0&single=true&output=csv";
let pointsURL =
"https://docs.google.com/spreadsheets/d/e/2PACX-1vQqjdVDnZ6IBD_TNSAYEAqF58fbG77bM8w68DdBtkJR-Fa8JgptB-BswaEfUG8qu3o0Cn7Mrhjn1Zeb/pub?output=csv";
-
window.addEventListener("DOMContentLoaded", init);
-
let map;
let panelID = "my-info-panel";
-
function init() {
map = L.map("map").setView([51.5, -0.1], 14);
-
// This is the Carto Positron basemap
L.tileLayer(
"https://cartodb-basemaps-{s}.global.ssl.fastly.net/light_all/{z}/{x}/{y}{r}.png",
@@ -26,7 +21,6 @@ function init() {
maxZoom: 19,
}
).addTo(map);
-
// Use PapaParse to load data from Google Sheets
// And call the respective functions to add those to the map.
Papa.parse(geomURL, {
@@ -40,7 +34,6 @@ function init() {
complete: addPoints,
});
}
-
function addGeoms(data) {
data = data.data;
let fc = {
@@ -59,10 +52,8 @@ function addGeoms(data) {
});
}
}
-
let geomStyle = { color: "black", fillColor: "#adbab7", weight: 2 };
let geomHoverStyle = { color: "green", fillColor: "#1e751e", weight: 4 };
-
L.geoJSON(fc, {
onEachFeature: function (feature, layer) {
layer.on({
@@ -73,14 +64,14 @@ function addGeoms(data) {
e.target.setStyle(geomHoverStyle);
},
click: function (e) {
- /* Create a popup content string*/
+ // Create a popup content string
var popupContent = "" + e.target.feature.properties.name + "
" + e.target.feature.properties.description;
- //* Create a popup and set its content*//
+ // Create a popup and set its content
var popup = L.popup()
.setLatLng(e.latlng)
.setContent(popupContent);
map.setView(e.latlng, 12);
- /* Open the popup on the map*/
+ // Open the popup on the map
popup.openOn(map);
},
});
@@ -88,9 +79,7 @@ function addGeoms(data) {
style: geomStyle,
}).addTo(map);
}
-
-
- function addPoints(data) {
+function addPoints(data) {
data = data.data;
let pointGroupLayer = L.layerGroup().addTo(map);
// Choose marker type. Options are:
@@ -101,14 +90,8 @@ function addGeoms(data) {
let markerType = "marker";
// Marker radius, Wil be in pixels for circleMarker, metres for circle, Ignore for point
let markerRadius = 100;
-
for (let row = 0; row < data.length; row++) {
let marker;
-
- //// add condition
- if (data[row].include === "y" || data[row].include === "2_Registered" || data[row].include === "1_Admin") {
-
-
if (markerType == "circleMarker") {
marker = L.circleMarker([data[row].lat, data[row].lon], {
radius: markerRadius,
@@ -121,13 +104,13 @@ function addGeoms(data) {
marker = L.marker([data[row].lat, data[row].lon]);
}
marker.addTo(pointGroupLayer);
-
// Pop-up marker with all data
marker.bindPopup(`
Description: > Go there <
Program: ${data[row].program}
Client: ${data[row].client}
+Dropbox: ${data[row].dropbox}
Dropbox: > Dropbox Link <
`); @@ -136,7 +119,6 @@ function addGeoms(data) { map.setView(e.latlng, map.getZoom() + 2); }, }); - // AwesomeMarkers is used to create fancier icons let icon = L.AwesomeMarkers.icon({ icon: "info-circle", @@ -147,25 +129,22 @@ function addGeoms(data) { }); if (!markerType.includes("circle")) { marker.setIcon(icon); - } - } + } } +} function parseGeom(gj) { // FeatureCollection if (gj.type == "FeatureCollection") { return gj.features; } - // Feature else if (gj.type == "Feature") { return [gj]; } - // Geometry else if ("type" in gj) { return [{ type: "Feature", geometry: gj }]; } - // Coordinates else { let type;