31:T4fd,mapbox_chart = { let container = html`

`; // Give the container dimensions. yield container; // Create the \`map\` object with the mapboxgl.Map constructor, referencing // the container div let map = new mapboxgl.Map({ container, center: [-105.2705, 40.015], // Boulder, Colorado zoom: 2, maxZoom: 20, style: "mapbox://styles/mapbox/" + style, // This is all one needs to set the projection. Values are derived from the input cell defined above. projection: { name: "globe" }, scrollZoom: true }); // map.addControl(new mapboxgl.FullscreenControl()); var draw = new MapboxDraw({ displayControlsDefault: false, controls: { // polygon: true, trash: true }, defaultMode: "draw_polygon" }); map.addControl(draw, "top-left"); map.on("load", () => { // Set the default atmosphere style map.setFog({}); }); map.addControl(new mapboxgl.NavigationControl(), "top-right"); // Add a scale control to the map map.addControl(new mapboxgl.ScaleControl()); mutable map = map; mutable draw = draw; // Be careful to clean up the map's resources using \`map.remove()\` whenever // this cell is re-evaluated. invalidation.then(() => map.remove()); }32:T6df,stationAvailabilityTableData = stationCoverage() .then((coverage) => coverage.features.filter((d) => dataMap.has(d.properties.site_code)) ) .then((features) => { return features .map((d, i) => { let dates = []; let ranges = JSON.parse(d.properties.ranges); let firstDate = d3.min(ranges, (d) => d3.timeParse("%s")(d.start_date)); let lastDate = d3.max(ranges, (d) => d3.timeParse("%s")(d.end_date)); let scale = d3 .scaleLinear() .domain([ d3.timeHour.offset(d3.timeParse("%Q")(quake.properties.time), -6), d3.timeHour.offset(d3.timeParse("%Q")(quake.properties.time), +72) ]) // TODO: determine best interval to display .range([0, 1]) .clamp(true); let datum = { distance: dataMap.get(d.properties.site_code)[0].properties.distance, // meters site_code: d.properties.site_code, site_id: d.properties.site_id, first_date: firstDate, timestamp: scale(d3.timeParse("%Q")(quake.properties.time)), // as a value in the open interval (0, 1) last_date: lastDate, sample_interval: d.properties.sample_interval, coverage: ranges.map((range) => { return [ // overlapping intervals scale(d3.timeParse("%s")(range.start_date)), scale(d3.timeParse("%s")(range.end_date)) ]; }) }; datum.percent = d3.sum(datum.coverage, (d) => d[1] - d[0]); datum.i = i; return datum; }) .filter((d) => +d.sample_interval <= 1) // Disregard sites with no data in our date range. .sort((a, b) => d3.descending(a.percent, b.percent)); })33:T6db,// References force this cell to re-evalutate and render markers when the user selection of campaigns changes. // Value of rendered is number of markers currently drawn on map. Markers are removed and redrawn with any invalidation of this cell. renderMarks = { function addStation2Map(feature, options) { var el = document.createElement("div"); el.className = options.class; let m = new mapboxgl.Marker(el).setLngLat(feature.geometry.coordinates); if (options.class == "station") { el.style["background-color"] = options.color; el.style["border"] = "solid 1px"; el.textContent = feature.properties.station_code; el.style.lineHeight = "3.5em"; m.setPopup( new mapboxgl.Popup({ offset: 25 }).setHTML( `

${feature.properties.station_code}

${d3.format(",.2r")( feature.properties.distance / 1e3 )} km from epicenter

${ feature.properties.sample_interval_information[0].sample_interval } second sample interval

` ) ); } else { el.innerHTML = `⭐`; } return m.addTo(map); } for (let i = markers.length - 1; i >= 0; i--) { markers[i].remove(); markers.pop(); } data.forEach((feature) => { markers.push( addStation2Map(feature, { color: stationColor, class: "station" }) ); }); markers.push( addStation2Map( { type: "Feature", geometry: { type: "Point", coordinates: quake.geometry.coordinates.slice(0, 2) }, properties: quake.properties }, { // options class: "epicenter" } ) ); return markers.length; }34:[] 2f:{"title":"🎯 Event Data Access","cells":[{"id":0,"value":"# 🎯 Event Data Access","pinned":false,"hidden":false,"mode":"md"},{"id":700,"value":"viewof shareMe = Inputs.text({\n label: \"Share this event\",\n width: width / 2,\n disabled: true,\n value: `https://observablehq.com/@earthscope/event-data-access?eventid=%22${eventid}%22&sensitivity=${+sensitivity}`\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":448,"value":"### Search recent USGS events","pinned":false,"hidden":false,"mode":"md"},{"id":407,"value":"viewof sourceUrl = Inputs.select(\n new Map([\n [\n \"Significant Earthquakes last 30 days\",\n \"https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/significant_month.geojson\"\n ],\n [\n \"4.5+ Earthquakes last 30 days\",\n \"https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/4.5_month.geojson\"\n ],\n [\n \"2.5+ Earthquakes last 30 days\",\n \"https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_month.geojson\"\n ],\n [\n \"All earthquakes last 30 days\",\n \"https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/all_month.geojson\"\n ]\n ]),\n {\n label: \"USGS Feed\",\n format: ([name, value]) => `${name}`\n }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":410,"value":"viewof searchEarthquakes = Inputs.search(suggestionsTableData)","pinned":false,"hidden":false,"mode":"ojs"},{"id":604,"value":"md`*You can click on column headers to sort the table below*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":422,"value":"viewof searchTable = Inputs.table(searchEarthquakes, {\n multiple: false,\n sort: \"time\",\n reverse: true,\n columns: [\"place\", \"time\", \"updated\", \"mag\", \"url\", \"type\"],\n value: searchEarthquakes[0],\n format: {\n type: (x, i) =>\n html`

${x}

`,\n mag: (x) => d3.format(\".2\")(x),\n updated: (x) => {\n let elapsed = d3.timeMinute.count(d3.utcParse(\"%Q\")(x), new Date());\n return elapsed >= 60\n ? \"over an hour ago\"\n : `${d3.format(\",\")(elapsed)} minutes ago`;\n },\n time: (x) => d3.timeFormat(\"%B %d, %Y @ %I:%M\")(new Date(x)),\n url: (x) => html`${x.split(\"/\").pop()}` // Extracts id from end of url.\n },\n width: { place: \"375px\", time: \"200px\" }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":450,"value":"### ... or enter a USGS Event ID for a particular earthquake","pinned":false,"hidden":false,"mode":"md"},{"id":265,"value":"error ? md`⚠️ Event ID *${eventid}* does not appear to be valid.` : md``","pinned":false,"hidden":false,"mode":"ojs"},{"id":8,"value":"viewof eventid = Inputs.text({\n label: md`**USGS Event ID**`,\n value: searchTable\n ? searchTable.id\n : importConfiguration.eventid\n ? importConfiguration.eventid\n : defaultQuake\n ? defaultQuake.id\n : \"ci38457511\",\n submit: true,\n placeholder: \"ci38457511\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":29,"value":"viewof sensitivity = Inputs.range([1, 10], {\n value: importConfiguration.sensitivity ? +importConfiguration.sensitivity : 2,\n step: 0.1,\n label: \"Detection Sensitivity (cm)\"\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":36,"value":"summary = md`The earthquake event of **${\n quake.properties.title\n}** on **${d3.timeFormat(\"%B %d, %Y\")(\n d3.timeParse(\"%Q\")(quake.properties.time)\n)}** has a recommended search radius of **${d3.format(\",.2f\")(\n recommendedDistance\n)} kilometers** based on a detection sensitivity of **${sensitivity} cm** displacement.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":233,"value":"tableDescription = md`There are **${d3.format(\",\")(\n data.length\n)}** GNSS stations within the search radius with data for this event.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":335,"value":"time_clarification = md` The table below shows high-rate data availability from **${[\n d3.timeHour.offset(d3.timeParse(\"%Q\")(quake.properties.time), -6),\n d3.timeHour.offset(d3.timeParse(\"%Q\")(quake.properties.time), +72)\n]\n .map((d) => d3.timeFormat(\"%B %d, %Y %H:%M\")(d))\n .join(\" to \")} UTC**.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":728,"value":"md`*Select which high rate data products you would like to include from the table below. Available High-rate data is selected by default. Green coverage shows where data is available. The magenta mark indicates time of earthquake.*`","pinned":false,"hidden":false,"mode":"ojs"},{"id":854,"value":"#### 💡 *Data availability updates daily*","pinned":false,"hidden":false,"mode":"md"},{"id":305,"value":"viewof stationAvailabilityTable = Inputs.table(stationAvailabilityTableData, {\n columns: [\"site_code\", \"distance\", \"sample_interval\", \"coverage\"],\n format: {\n coverage: (intervals, i) =>\n sparkline(intervals, {\n width: 750,\n timestamp: stationAvailabilityTableData[i].timestamp\n }),\n percent: (d) => d3.format(\".2%\")(d),\n sample_interval: (d) => 1 / d + \" hz\",\n distance: (d) => d3.format(\",.2r\")(d / 1e3) + \" km\"\n },\n value: stationAvailabilityTableData.filter((d) => d.percent > 0),\n sort: \"distance\",\n width: {\n coverage: \"750px\"\n }\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":361,"value":"map_summary = md`The globe below shows station locations within the [recommended cutoff distance](https://agupubs.onlinelibrary.wiley.com/doi/full/10.1002/2015GL064278) (shown with blue circle) for a earthquake of magnitude **${quake.properties.mag}** and a displacement of **${sensitivity} centimeters.**\n\n**Note:** Adjust the Detection Sensitivity above. Reducing this value creates a larger search radius.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":130,"value":"viewof resetMapButton = Inputs.button(\"Reset Camera\")","pinned":false,"hidden":false,"mode":"ojs"},{"id":133,"value":"viewof style = Inputs.select(\n [\n \"streets-v11\",\n \"outdoors-v11\",\n \"light-v10\",\n \"dark-v10\",\n \"satellite-v9\",\n \"satellite-streets-v11\",\n \"navigation-day-v1\",\n \"navigation-night-v1\"\n ],\n { label: \"Globe Style\", value: \"navigation-day-v1\" }\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":100,"value":"$31","pinned":false,"hidden":false,"mode":"ojs"},{"id":566,"value":"md`## \\`GET\\` GNSS Data for \\`${eventid}\\``","pinned":false,"hidden":false,"mode":"ojs"},{"id":600,"value":"stationAvailabilityTable.length > 0\n ? md`Your selected stations above can be opened in the Data Access Notebook to prepare a downloader that fetches RINEX files locally on your machine. The link below helps you find high-rate data spanning one day prior and one day after the selected earthquake with event ID **\\`${eventid}\\`**.\n\n*If you have a large number of stations, you will need to copy paste the stations below into the GNSS Data Access notebook.*\n\n

Customized URL → GNSS Data Access notebook

`\n : md`There does not appear to be any high-rate data available for the selections above.`","pinned":false,"hidden":false,"mode":"ojs"},{"id":680,"value":"viewof textarea = Inputs.textarea({\n label: \"Stations to Copy\",\n disabled: true,\n rows: 12,\n // Remove duplicate stations\n value: [...new Set(stationAvailabilityTable.map((d) => d.site_code))].join(\n \" \"\n )\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":14,"value":"---\n## Appendix","pinned":false,"hidden":false,"mode":"md"},{"id":158,"value":"markerRadius = 12","pinned":false,"hidden":false,"mode":"ojs"},{"id":563,"value":"shareableUrl = \"https://observablehq.com/@unavco/gnss-data-access\" +\n shareableSuffix","pinned":false,"hidden":false,"mode":"ojs"},{"id":559,"value":"shareableSuffix = {\n stationAvailabilityTable;\n\n let url = \"?\"; // Everything before the query\n\n let strippedParams = {};\n\n for (const [key, value] of Object.entries(exportConfiguration)) {\n if (value) {\n strippedParams[key] = value;\n }\n }\n\n return url + new URLSearchParams(strippedParams).toString();\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":542,"value":"// Every property has a string as its value.\nexportConfiguration = {\n let end = d3.timeParse(\"%Q\")(quake.properties.time);\n\n let obj = {\n stations:\n stationAvailabilityTable.length < 50\n ? [...new Set(stationAvailabilityTable.map((d) => d.site_code))]\n : [],\n sampleIntervalSelection: [\"<=1\"],\n startDate: d3.timeFormat(\"%Y-%m-%d\")(\n d3.timeDay.offset(d3.timeParse(\"%Q\")(quake.properties.time), -1)\n ),\n endDate: d3.timeFormat(\"%Y-%m-%d\")(\n end < d3.timeDay.offset(today, -1) ? d3.timeDay.offset(end, +1) : end\n )\n };\n\n for (const property in obj) {\n obj[property] = JSON.stringify(obj[property]);\n }\n\n return obj;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":943,"value":"today = new Date()","pinned":false,"hidden":false,"mode":"ojs"},{"id":412,"value":"suggestionsTableData = suggestions.features.map((d) => {\n d.properties.id = d.id;\n return d.properties;\n})","pinned":false,"hidden":false,"mode":"ojs"},{"id":416,"value":"suggestions = (await fetch(sourceUrl)).json()","pinned":false,"hidden":false,"mode":"ojs"},{"id":291,"value":"$32","pinned":false,"hidden":false,"mode":"ojs"},{"id":263,"value":"mutable error = false","pinned":false,"hidden":false,"mode":"ojs"},{"id":281,"value":"mutable previousSearch = \"ci38457511\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":4,"value":"quake = fetch(\n `https://earthquake.usgs.gov/fdsnws/event/1/query?format=geojson&eventid=${\n eventid ? eventid : defaultQuake.id\n }`\n)\n .then((response) => {\n mutable error = false;\n mutable previousSearch = eventid; // only note successful searches in memory\n return response.json();\n })\n .catch((e) => {\n console.log(eventid, \"invalid earthquake id or no results\");\n mutable error = true;\n return defaultQuake;\n })","pinned":false,"hidden":false,"mode":"ojs"},{"id":184,"value":"defaultQuake = suggestions.features.length\n ? suggestions.features[0]\n : fetch(\n `https://earthquake.usgs.gov/fdsnws/event/1/query?format=geojson&eventid=${\"ci38457511\"}`\n ).then((response) => response.json())","pinned":false,"hidden":false,"mode":"ojs"},{"id":316,"value":"dataMap = d3.group(data, (d) => d.properties.station_code)","pinned":false,"hidden":false,"mode":"ojs"},{"id":69,"value":"// Search for the location and time of occurrence of a selected quake fromt the past week.\ndata = eventSearch({\n lon: quake.geometry.coordinates[0],\n lat: quake.geometry.coordinates[1],\n date: d3.timeFormat(\"%Y-%m-%d\")(d3.timeParse(\"%Q\")(quake.properties.time)),\n radius: recommendedDistance * 1e3 // km * (1000 meters per km)\n}).then(\n (\n list // Transform return events into GeoJSON Features for consistency\n ) =>\n list.map((d) => {\n return {\n type: \"Feature\",\n properties: d,\n geometry: {\n type: \"Point\",\n coordinates: [d.lon, d.lat]\n }\n };\n })\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":198,"value":"tableData = {\n return data.map((d) => {\n return {\n station: d.properties.station_code,\n distance: d.properties.distance // meters\n };\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":733,"value":"resetMap = {\n resetMapButton;\n\n map.flyTo({\n center: [-105.2705, 40.015], // Fly to the selected target\n duration: 5 * 1e3,\n zoom: 2,\n essential: true // This animation is considered essential with\n //respect to prefers-reduced-motion\n });\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":238,"value":"highlightLocation = {\n quake;\n\n if (!error) {\n const target = {\n center: quake.geometry.coordinates,\n zoom: 5\n // bearing: 130,\n // pitch: 75\n };\n\n map.flyTo({\n ...target, // Fly to the selected target\n duration: 10 * 1e3,\n essential: true // This animation is considered essential with\n //respect to prefers-reduced-motion\n });\n }\n\n return quake.geometry.coordinates;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":104,"value":"mutable draw = null","pinned":false,"hidden":false,"mode":"ojs"},{"id":106,"value":"mutable map = null","pinned":false,"hidden":false,"mode":"ojs"},{"id":118,"value":"mutable markers = []","pinned":false,"hidden":false,"mode":"ojs"},{"id":127,"value":"stationColor = \"#24f024\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":121,"value":"$33","pinned":false,"hidden":false,"mode":"ojs"},{"id":469,"value":"mutable ids2Remove = []","pinned":false,"hidden":false,"mode":"ojs"},{"id":467,"value":"renderEarthquake = {\n highlightLocation;\n\n draw.delete(ids2Remove);\n // Redraw previously drawn polygons, if any.\n\n let circle = d3\n .geoCircle()\n .center(quake.geometry.coordinates)\n .precision(1)\n .radius(magnitudeRadius(quake) / 5)();\n\n //mutable ids2Remove.push(draw.add(circle)[0]); // Add a Polygon feature.\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":935,"value":"recommendedCircleGeoJSON = {\n const radiusDegrees = recommendedDistance / 111;\n\n const feature = d3.geoCircle()\n .center(quake.geometry.coordinates)\n .radius(radiusDegrees)\n .precision(1)();\n\n return {\n type: \"FeatureCollection\",\n features: [{ type: \"Feature\", geometry: feature }]\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":934,"value":"recommendedCircleLayer = {\n if (!map || !recommendedCircleGeoJSON) return;\n\n const srcId = \"recommended-circle-src\";\n const fillId = \"recommended-circle-fill\";\n const lineId = \"recommended-circle-outline\";\n\n // Clean up previous layers/sources if they exist\n if (map.getLayer(fillId)) map.removeLayer(fillId);\n if (map.getLayer(lineId)) map.removeLayer(lineId);\n if (map.getSource(srcId)) map.removeSource(srcId);\n\n // Add GeoJSON source\n map.addSource(srcId, {\n type: \"geojson\",\n data: recommendedCircleGeoJSON\n });\n\n // Fill layer\n map.addLayer({\n id: fillId,\n type: \"fill\",\n source: srcId,\n paint: {\n \"fill-color\": \"#60a5fa\",\n \"fill-opacity\": 0.25\n }\n });\n\n // Outline layer\n map.addLayer({\n id: lineId,\n type: \"line\",\n source: srcId,\n paint: {\n \"line-color\": \"#2563eb\",\n \"line-width\": 2\n }\n });\n\n return true;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":154,"value":"","pinned":false,"hidden":false,"mode":"html"},{"id":12,"value":"mutable importConfiguration = {\n let dict = {};\n let i = 0;\n\n // Hack: Fixes apparent bug with Observable passing location.search down from parent frame.\n while (!location.search && i < 2) {\n i++;\n yield Promises.tick(1000, {});\n }\n\n if (location.search) {\n let queries = location.search.length\n ? location.search\n .substring(1)\n .split(\"&\")\n .map((d) => d.split(\"=\"))\n : [];\n\n queries.forEach((d) => {\n if (d[1]) {\n try {\n dict[d[0]] = JSON.parse(decodeURIComponent(d[1]));\n } catch (error) {\n console.log(\"Unable to process query parameter: \", d[0], d[1]);\n }\n }\n });\n }\n\n yield dict;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":26,"value":"// kilometers\nrecommendedDistance = Math.max(\n Math.ceil(\n cutoffDistance({\n magnitude: Math.abs(quake.properties.mag),\n displacement: sensitivity / 100 // meters\n })[\"MelgarEtAl2015_3D\"] // Use default displacement\n ) / 1e3,\n 5 // meters\n)","pinned":false,"hidden":false,"mode":"ojs"},{"id":307,"value":"// Returns a canvas element to represent a series of intervals in the range [0, 1].\nfunction sparkline(intervals, { width = 250, height = 20, timestamp = 0 }) {\n const x = d3\n .scaleLinear()\n .domain([0, 1])\n .range([1, width - 1]);\n const y = d3\n .scaleLinear()\n .domain([0, 1])\n .range([height / 2, height / 2]);\n const context = DOM.context2d(width, height);\n const line = d3\n .line()\n .x((d, i) => x(d))\n .y(y)\n .context(context);\n\n context.beginPath();\n context.rect(0, 0, width, height);\n context.stroke();\n\n context.lineWidth = height - 2;\n context.strokeStyle = \"green\";\n\n intervals.forEach((range) => {\n context.beginPath();\n line(range);\n context.stroke();\n });\n\n context.strokeStyle = \"magenta\";\n context.beginPath();\n line([timestamp * 0.995, timestamp * 1.005]);\n context.stroke();\n\n return context.canvas;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":115,"value":"mapboxgl = {\n const gl = await require(\"mapbox-gl@2.9.1\");\n if (!gl.accessToken) {\n gl.accessToken =\n \"pk.eyJ1IjoiYnJvb2tzbWFwcyIsImEiOiJja25ycjdmZXMwc3NoMm9xbXdpNThra2huIn0.j1ccDRj-S8MCp33aq9zbDw\";\n const href = await require.resolve(\"mapbox-gl@2.9.1/dist/mapbox-gl.css\");\n document.head.appendChild(html``);\n }\n return gl;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":112,"value":"MapboxDraw = {\n const gl = await require(\"@mapbox/mapbox-gl-draw\");\n const href = await require.resolve(\n \"@mapbox/mapbox-gl-draw/dist/mapbox-gl-draw.css\"\n );\n document.head.appendChild(html``);\n return gl;\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":487,"value":"// https://observablehq.com/@jashkenas/quakespotter-0-1\nmagnitudeRadius = {\n const scale = d3.scaleSqrt().domain([0, 100]).range([0, 10]);\n return function (quake) {\n return scale(Math.exp(quake.properties.mag));\n };\n}","pinned":false,"hidden":false,"mode":"ojs"},{"id":429,"value":"// extent = d3.extent(quakes.features, (d) => d.properties.mag)\nextent = [0, 9.5]","pinned":false,"hidden":false,"mode":"ojs"},{"id":426,"value":"colorScale = d3.scaleLinear().domain(extent).range([0, 1])","pinned":false,"hidden":false,"mode":"ojs"},{"id":71,"value":"import { eventSearch, stationCoverage } from \"@unavco/web-services\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":23,"value":"import {\n peakGroundDisplacement,\n cutoffDistance,\n pgdVersion\n} from \"@unavco/peak-ground-displacement\"","pinned":false,"hidden":false,"mode":"ojs"},{"id":910,"value":"import { mrkdwn } from \"@earthscope/slack\"","pinned":false,"hidden":false,"mode":"ojs"}],"files":"$W34","stdlib":"1","titling":"auto"}