Add survey markers layer

.gitignore

@@ -3,3 +3,4 @@ dist
 *.geojson
 *.shp
 layers/dot-cams/*/data/states.js
+layers/survey-markers/states.js

layers/index.js

@@ -17,6 +17,7 @@ import light_pollution from './light_pollution.js';
 import state_land from './state-land/index.js';
 import trips from './trips/index.js';
 import dot_cams from './dot-cams/index.js';
+import survey_markers from './survey-markers/index.js';
 
 const layerCategories = [
     { // Base maps
@@ -88,6 +89,7 @@ const layerCategories = [
             },
         ]
     },
+    survey_markers,
     dot_cams,
     trips,
     chains,

layers/survey-markers/get_data.sh

@@ -0,0 +1,37 @@
+#!/bin/sh
+
+# TODO: use https://geodesy.noaa.gov/pub/DS_ARCHIVE/BETA_PRODUCTS/ instead
+# I should have used this in the first place, but it took me a long time to find
+
+mkdir -p data
+
+mkdir -p tmp
+cd tmp
+for state in $(curl https://geodesy.noaa.gov/cgi-bin/sf_archive.prl | grep "<option" | cut -d '"' -f2); do
+    lowercase_state=$(echo $state | tr '[:upper:]' '[:lower:]')
+    curl -o $state.zip "https://geodesy.noaa.gov/cgi-bin/sf_archive.prl?StateSelected=${state}&CompressType=Zipped"
+    unzip $state.zip
+    ogr2ogr -f GeoJSON ../data/$lowercase_state.geojson $lowercase_state.shp
+    sed -i '/^"crs":/d' ../data/$lowercase_state.geojson # TODO: handle this projection properly
+done
+cd ..
+rm -r tmp
+
+# hack hack hack
+#
+# If I write this to one big file, I can't take advantage of any lazy loading
+# for performance reasons, so I'm constrained to having a bunch of files. I
+# can't programmatically import those, since es6 imports don't allow for that.
+# So, codegen it is (and fairly gross codegen at that!).
+truncate -s 0 states.js
+for file in ./data/*; do
+    basename=$(basename $file .geojson)
+    echo "import _$basename from '$file?url';" >> states.js
+done
+echo >> states.js
+echo "export default {" >> states.js
+for file in ./data/*; do
+    basename=$(basename $file .geojson)
+    echo "    $basename: _$basename," >> states.js
+done
+echo "};" >> states.js

layers/survey-markers/index.js

@@ -0,0 +1,39 @@
+import VectorLayer from 'ol/layer/Vector';
+import {Vector as VectorSource} from 'ol/source.js';
+import GeoJSON from 'ol/format/GeoJSON.js';
+
+import {Style} from 'ol/style.js';
+import Icon from 'ol/style/Icon.js';
+
+import pin from './pin.svg?url';
+import states from './states.js';
+
+let survey_markers = {
+    name: "National Geodetic Survey Markers",
+    details: `These are extremely large, and loading too many at once may crash your browser.<br><a href="#" onclick="this.closest('details').querySelectorAll('ul li input').forEach(e => e.checked || e.click()); return false;">Enable All (will <i>definitely</i> crash your browser)</a>`,
+    layers: [],
+};
+
+for (let [state, url] of Object.entries(states)) {
+    const vectorLayer = new VectorLayer({
+        source: new VectorSource({
+            url: url,
+            format: new GeoJSON,
+        }),
+        style: new Style({
+            image: new Icon({
+                anchor: [0.5, 1],
+                src: pin,
+            }),
+        }),
+    });
+
+    survey_markers.layers.push({
+        name: state,
+        layer: vectorLayer,
+    });
+}
+
+survey_markers.layers.sort((a, b) => a.name > b.name ? 1 : -1); // Names are always unique
+
+export default survey_markers;

layers/survey-markers/pin.svg

@@ -0,0 +1,13 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   viewBox="0 0 384 512"
+   width="40px"
+   height="30px"
+   version="1.1"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:svg="http://www.w3.org/2000/svg">
+  <!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. -->
+  <path
+     d="m 384,192 c 0,87.4 -117,243 -168.3,307.2 -12.3,15.3 -35.1,15.3 -47.4,0 C 116.1,435 0,279.4 0,192 0,85.96 85.96,0 192,0 245.96029,0 294.73775,22.275796 329.62577,58.136607 363.27205,92.721042 384,139.94065 384,192 Z"
+     style="fill:#000;fill-opacity:1" />
+</svg>

main.js

@@ -137,7 +137,7 @@ function objectToTable(o) {
   // TODO: hack hack hack
   let table = `<table style="margin: 0.5em; border-collapse: collapse;">`;
   for (let [key, value] of Object.entries(o)) {
-    if (typeof value === "object") {
+    if (typeof value === "object" && value !== null) {
       value = objectToTable(value);
     }
     if (typeof value === "string" && /^https?:\/\//.test(value)) {