31:Tcd5,viewof globe = { const width = w; const height = width; const context = DOM.context2d(width, height); let i = 0; let date = dates[i]; const projection = d3 .geoOrthographic() .fitExtent( [ [-1, -1], [width + 1, height + 1] ], sphere ) .rotate([110, -45]) .clipExtent([ [-1, -1], [width + 1, height + 1] ]); let path = d3.geoPath(projection, context); const t = d3.interval((elapsed) => { date = dates[i++]; if (i == dates.length) { i = 0; } render(); }, delay); // Hack: Kill the timer if this cell receives explicit invalidation call. invalidation.then(() => { if (t) t.stop(); }); function render() { let selectedFeatures = []; let siteMap = yearMap.get(d3.timeFormat("%Y")(date)); let max = 0; if (siteMap) { siteMap.forEach((visits, site, map) => { let feature = visits[0]; // Select first available visit. feature._count = visits.length; // Record max for use in color scale domain extent. if (visits.length > max) { max = visits.length; } selectedFeatures.push(feature); }); } let colorScale = d3.scaleSequentialSqrt().domain([1, max]).range([0, 1]); // TODO (brooks): Refactor const circle = d3.geoCircle(); let circles = selectedFeatures.map((visit, i) => { let c = circle .center(visit.geometry.coordinates) .radius(0.3) .precision(25)(); // Compute a color representing relative frequency of visits compared to other sites // at this point in history (a particular date). // Find the current date in the visits for a particular site code to determine current frequency count // of visits. c.color = d3.interpolateTurbo(colorScale(visit._count)); return c; }); context.clearRect(0, 0, width, height); path.pointRadius(1.5); context.beginPath(); path(sphere); context.lineWidth = 1.5; context.fillStyle = "#cfe0ff"; context.strokeStyle = "#000"; context.fill(); context.stroke(); context.lineWidth = 0.5; context.beginPath(); path(graticule); context.strokeStyle = "#aaa"; context.stroke(); // land context.beginPath(); path(world); context.fillStyle = "#faf8f5"; context.fill(); context.stroke(); // Draw the visits, either as projected circles on the surface, or flat circles in space. context.lineWidth = 1; circles.forEach((d) => { const color = d3.color(d.color); color.opacity = 0.4; context.fillStyle = color; context.beginPath(), path(d); context.fill(); color.opacity = 0.8; context.strokeStyle = color; context.stroke(); }); path.pointRadius(null); context.lineWidth = 1.5; // Top left hand corner, date. const textColor = d3.color("#000"); textColor.opacity = 0.1; context.fillStyle = textColor; context.font = `${width / 8}px courier`; context.textAlign = "center"; context.fillText(d3.timeFormat("%Y")(date), width / 2, height / 2); } return d3 .select(context.canvas) .call(zoom(projection).on("zoom.render", render)) .call(render) .node(); }32:T70b,map = { const container = html`

`; yield container; const map = L.map(container).setView([0, 0], 2); L.tileLayer("https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png", { attribution: "© OpenStreetMap contributors" }).addTo(map); const layer = L.geoJSON( [ { type: "FeatureCollection", features: table .reverse() // The table is sorted with highest number of visits first. We want to draw high visits "on top". .map(({ longitude, latitude, site, visits, first_visit }) => ({ type: "Feature", properties: { site: site, visits: visits, first_visit: first_visit }, geometry: { type: "Point", coordinates: [longitude, latitude] } })) } ], { pointToLayer: (feature, latlng) => L.circleMarker(latlng, { radius: 5, color: "black", weight: 1, opacity: 1, fillOpacity: 0.6 }), style: ({ properties: { visits, first_visit } }) => ({ fillColor: d3.interpolateTurbo(frequencyScale(visits)), strokeColor: d3.interpolateTurbo(frequencyScale(visits)) }), onEachFeature: function (feature, layer) { const { site, visits, first_visit } = feature.properties; const d = stationMap.get(site); layer.bindPopup(md`### ${site}

Visited ${d3.format(",")( visits )} times since ${monthFormat(first_visit)}.

`); } } ).addTo(map); }33:[] 2f:{"title":"UNAVCO Station Maintenance","cells":[{"id":0,"value":"# UNAVCO Station Maintenance","pinned":false,"hidden":false,"mode":"md"},{"id":1915,"value":"md`It takes a lot of work to maintain all of the stations that feed data to the scientific community we support. For example, we delivered **142 terabytes of data between October 2020 and September 2021**. But that data does not just appear out of thin air! We gather data from all over the world using sensors placed out in nature and maintained by a staff of field engineers who work hard to keep our network working as we expect.\n\nThis notebook is aimed at revealing some of the patterns that can be gleaned from the maintenance visits we perform (and log...) across our geodetic locations.\n\nExplore, have fun, and [leave feedback](https://forms.gle/zWGH7Dnb1bY1rZee6). We think this is neat, and you can help let us know what you think is neat in the world of geoscience.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1726,"value":"title = md`## Where have our engineers been working?`","pinned":false,"hidden":false,"mode":"ojs"},{"id":532,"value":"description = md`The *animated* map below shows where and when station maintenance was performed on UNAVCO operated sensors located throughout the world.\n\nSit back and watch the UNAVCO station network develop with repairs and upgrades over **${d3.format(\n \",.5r\"\n)(data.features.length)}** on-site visits over the past **${d3.timeYear.count(\n beginning,\n today\n)}** years.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1640,"value":"legend = Legend(\n d3.scaleSequentialSqrt([1, yearlyMaxVisitsPerSite], d3.interpolateTurbo),\n {\n title: \"Visits in a given year\"\n }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1735,"value":"explainer = md`*Click and drag to move the globe. Scroll to zoom.*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":912,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":1739,"value":"md`## Some sites demand more from us than others`","pinned":false,"hidden":false,"mode":"ojs"},{"id":715,"value":"md`The table below contains all of the *stations* corresponding to geodetic locations throughout the world that have been maintained by UNAVCO.\n\nSometimes a polar bear plays rough with a receiver. Forest fires turn radomes to a plastic puddle of goo. Locals in need of solar panels have been known to perform unscheduled site maintenance. Borehole sensors sometimes succumb to extreme stresses underground.\n\nThe timeline tick marks ${ticks(\n d3.range(0, 100).filter((d) => Math.random() > 0.8),\n {\n width: 100,\n strokeStyle: \"rgba(255,0,0,0.8)\"\n }\n)} show the distribution of visits throughout all time for each station, with the right-most ticks representing the most recent maintenance visits. The visit trend shows *how* our patterns of visiting a particular site have changed over time.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1987,"value":"viewof tableStartDate = Inputs.date({\n label: \"Start\",\n value: dateFormat(beginning)\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1992,"value":"viewof tableEndDate = Inputs.date({\n label: \"End\",\n value: dateFormat(today),\n min: dateFormat(tableStartDate),\n max: dateFormat(today)\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":2043,"value":"viewof useRegex = Inputs.toggle({ label: \"Search using Regex\" })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1136,"value":"viewof search = Inputs.search(stationTableData, searchOptions)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1188,"value":"md`There were **${d3.format(\",\")(\n d3.sum(table, (d) => d.visits)\n)}** total visits between **${d3.timeFormat(\"%B, %Y\")(\n tableStartDate\n)}** and **${d3.timeFormat(\"%B, %Y\")(\n tableEndDate\n)}** contained in the results matching your search in the table below.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":685,"value":"viewof table = Inputs.table(search, {\n columns: [\n \"site\",\n \"first_visit\",\n \"timeline\",\n \"visit_trend\",\n \"visits\",\n \"visits_year\",\n \"longitude\",\n \"latitude\"\n ],\n format: {\n sort: \"visits\",\n site: (x) =>\n html`${x}`,\n timeline: (times) =>\n ticks(times.ticks, {\n domain: [tableStartDate, tableEndDate],\n width: 400,\n height: 20,\n strokeStyle: \"rgba(255, 0, 0, 0.5)\"\n }),\n first_visit: (d) => yearFormat(d),\n visit_trend: (bins) =>\n line(bins, {\n domain: frequencyExtent,\n width: 150,\n height: 20,\n strokeStyle: \"rgba(0, 0, 0, 1)\"\n })\n },\n rows: 24,\n align: {\n site: \"center\",\n longitude: \"center\",\n latitude: \"center\",\n visits: \"center\",\n timeline: \"center\"\n },\n width: {\n timeline: \"400px\",\n visit_trend: \"150px\"\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1831,"value":"md`Here are your selected stations from the table above.\n\n*Click and drag to move the map. Scroll to zoom.*\n\n*Click on markers to learn more about each site.*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1836,"value":"Legend(d3.scaleSequentialSqrt(frequencyExtent, d3.interpolateTurbo), {\n title: \"Total visits over time\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1810,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":1683,"value":"md`## Get Data!`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1746,"value":"md`*Select particular sites from the table above in order to get data stored by them in the UNAVCO archive.*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1717,"value":"viewof stations = Inputs.textarea({\n label: \"Stations\",\n disabled: true,\n rows: 8,\n placeholder: \"Stations that you can copy/paste will be shown here.\",\n value: table.map((d) => d.site).join(\" \")\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":1713,"value":"copyUrlButton = Copier(\"📋 Copy Stations\", { value: stations })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1712,"value":"md`The [data access tool](https://observablehq.com/@unavco/gnss-data?collection=@unavco/unavco-for-observable) can be used to access data from UNAVCO archives for the selected **${d3.format(\n \",\"\n)(table.length)}** stations above.\n\n**Copy paste your stations [here](https://observablehq.com/@unavco/gnss-data?collection=@unavco/unavco-for-observable#where).**`","pinned":false,"hidden":false,"mode":"ojs"},{"id":322,"value":"md`---`","pinned":false,"hidden":false,"mode":"ojs"},{"id":321,"value":"md`## Appendix`","pinned":false,"hidden":false,"mode":"ojs"},{"id":1342,"value":"beginning = new Date(1991, 0, 1)","pinned":false,"hidden":false,"mode":"ojs"},{"id":1704,"value":"stationsToImport = table.map((d) => d.site).join(\" \")","pinned":false,"hidden":false,"mode":"ojs"},{"id":1260,"value":"dates = d3.timeYear.range(beginning, new Date())","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"data = fetch(\n `https://web-services.unavco.org/backoffice-geoserver-test/gnss/ows?service=WFS&version=1.0.0&request=GetFeature&typeName=gnss%3Amaintenance_reports&outputFormat=application%2Fjson`\n)\n .then((response) => response.json())\n .then((collection) => {\n collection.features = collection.features.map((feature) => {\n let match000 = /^000/;\n let replace000 = \"200\";\n feature.properties.starttime = feature.properties.starttime.replace(\n match000,\n replace000\n );\n feature.properties.stoptime = feature.properties.stoptime.replace(\n match000,\n replace000\n );\n\n let match00 = /^00/;\n let replace00 = \"20\";\n feature.properties.starttime = feature.properties.starttime.replace(\n match00,\n replace00\n );\n feature.properties.stoptime = feature.properties.stoptime.replace(\n match00,\n replace00\n );\n return feature;\n });\n return collection;\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":1663,"value":"yearlyMaxVisitsPerSite = {\n let max = 0;\n\n yearMap.forEach((value, key) => {\n value.forEach((visits, site) => {\n if (visits.length > max) {\n max = visits.length;\n }\n });\n });\n\n return max;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":21,"value":"yearMap = d3.group(\n data.features,\n (d) => d3.timeFormat(\"%Y\")(dateParse(d.properties.starttime)),\n (d) => d.properties.site_code\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":443,"value":"stationMap = d3.group(data.features, (d) => d.properties.site_code)","pinned":false,"hidden":false,"mode":"ojs"},{"id":658,"value":"stationTableData = {\n let rows = [];\n\n stationMap.forEach((value, key, map) => {\n let start = dateParse(stationMap.get(key)[0].properties.starttime);\n\n if (start < tableStartDate || start > tableEndDate) return;\n\n let yearlyVisits =\n value.length / Math.max(d3.timeYear.count(start, today), 1);\n\n rows.push({\n site: key,\n longitude: value[0].geometry.coordinates[0],\n latitude: value[0].geometry.coordinates[1],\n timeline: {\n ticks: value.map((d) => dateParse(d.properties.starttime)),\n k: yearlyVisits\n },\n visits_year: yearlyVisits,\n visit_trend: d3\n .bin()\n .domain([tableStartDate, tableEndDate])(\n value.map((d) => dateParse(d.properties.starttime))\n )\n .map((d) => d.length),\n visits: value.length,\n first_visit: start\n });\n });\n\n return rows.sort((a, b) => b.visits - a.visits);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":557,"value":"frequencyExtent = {\n let min = Infinity;\n let max = 0;\n\n stationMap.forEach((value, key, map) => {\n if (value.length > max) max = value.length;\n if (value.length < min) min = value.length;\n });\n\n return [min, max];\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":570,"value":"frequencyScale = d3.scaleLinear().domain(frequencyExtent).range([0, 1])","pinned":false,"hidden":false,"mode":"ojs"},{"id":275,"value":"world = {\n var world = await (\n await fetch(\"https://unpkg.com/world-atlas@1/world/110m.json\")\n ).json();\n return topojson.feature(world, world.objects.countries);\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":30,"value":"dateParse = d3.timeParse(\"%Y-%m-%dT%H:%M:%SZ\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":588,"value":"yearFormat = d3.timeFormat(\"%Y\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":1883,"value":"monthFormat = d3.timeFormat(\"%B, %Y\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":32,"value":"dateFormat = d3.timeFormat(\"%Y-%m-%d\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":288,"value":"padding = 0","pinned":false,"hidden":false,"mode":"ojs"},{"id":267,"value":"r = w / 2 - 2 - padding","pinned":false,"hidden":false,"mode":"ojs"},{"id":263,"value":"w = Math.min(980, width)","pinned":false,"hidden":false,"mode":"ojs"},{"id":541,"value":"delay = 1e3 // milliseconds","pinned":false,"hidden":false,"mode":"ojs"},{"id":1367,"value":"today = new Date()","pinned":false,"hidden":false,"mode":"ojs"},{"id":903,"value":"graticule = d3.geoGraticule10()","pinned":false,"hidden":false,"mode":"ojs"},{"id":260,"value":"topojson = require(\"topojson-client@3\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":1813,"value":"L = {\n const L = await require(\"leaflet@1/dist/leaflet.js\");\n if (!L._style) {\n const href = await require.resolve(\"leaflet@1/dist/leaflet.css\");\n document.head.appendChild(L._style = html``);\n }\n return L;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":2053,"value":"searchOptions = {\n let options = {\n placeholder: \"AB02\",\n columns: [\"site\"], // only search on column names.\n label: \"Station Code\",\n datalist: [\"AB\", \"P123\", \"B\", \"P101\"]\n };\n\n const regexSearch = function (query) {\n return function (row) {\n try {\n let matches = row.site.match(new RegExp(query, \"i\"));\n console.log(row.site, matches, query);\n return matches ? matches.length > 0 : false;\n } catch (e) {\n console.log(\"RegEx error: \", e);\n return false;\n }\n };\n };\n\n if (useRegex) {\n options.datalist = [\"^[A-Z]*$\", \"P123\", \"^B[0-9]+$\", \"AB+\"];\n options.filter = regexSearch;\n options.placeholder = \"ab+c\";\n }\n\n return options;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":920,"value":"sphere = ({ type: \"Sphere\" })","pinned":false,"hidden":false,"mode":"ojs"},{"id":916,"value":"import { zoom } from \"@d3/versor-zooming\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":38,"value":"import { Scrubber } from \"@mbostock/scrubber\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":376,"value":"import { Calendar } from \"@observablehq/calendar-component\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1637,"value":"import { Legend } from \"@d3/color-legend\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":719,"value":"import { ticks, line } from \"@bmershon/inline-plots\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":1690,"value":"import { Copier } from \"@mbostock/copier\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W33","stdlib":"1","titling":"auto"}