3f:null 40:["$","title",null,{"children":"SF Bay Water Quality | Simon Konzett's Workspace | Observable"}] 46:T149b,html`

${viewof mode}

${viewof stationsFlag}

${viewof mapParams}

${viewof measurement1}

${ mode == "Map" ? html`

${viewof measurement2}

` : html`` }

${ measurement2 == 'None' || mode == "TS" ? html`

${viewof agg1}

${viewof granularity1}

` : html`

${viewof agg1}

${viewof agg2}

` }

${viewof years1}

${ (measurement2 == 'None' && mode == 'Map') ? html`

${viewof ts}

` : html` ${ mode == 'Map' ? html`

${viewof years2}

` : html`` }` }

${ (mapParams == 'More' || mapParams == 'All') && mode == 'Map' ? html`

${viewof months1}

${ measurement2 !== 'None' ? html`

${viewof months2}

` : html`` }

` : html`` } ${ (mapParams == 'Some' || mapParams == 'More' || mapParams == 'All') ? html`

${viewof station1}

${ (measurement2 !== 'None' && mode == 'Map') ? html`

${viewof station2}

` : html`` }

${viewof distanceToStation1}

${ (measurement2 !== 'None' && mode == 'Map') ? html`

${viewof distanceToStation2}

` : html`` }

` : html`` } ${ mapParams == 'All' ? html`

${viewof depth1}

${viewof depth2}

${ mode == 'Map' ? html`

${viewof days1}

${viewof days2}

${viewof hours1}

${viewof hours2}

` : html`` }` : html`` } ${ mode == 'Map' ? html` ${ measurement2 == 'None' ? html`

${mapSamplingStationsLeft}

${ ts == 'Horizon' ? html`

${horizonTSPlot}

` : html`

${stackedTSPlot}

` }

` : html`

${mapSamplingStationsLeft}

${mapSamplingStationsRight}

` }` : html`

${stackedTSPlot}

${horizonTSPlot}

` }

`;47:T4b5,function createMapSamplingStations({ years, months, days, hours, depth, agg, station, distanceToStation, measurement, color, // Blues, Reds, Greens range, width, height, collide, }) { // Assuming `filteredWaterData` has a structure similar to what `updateFeatures` expects // const data = filterAndAggregateStationData(); const data = filterAndAggregateStationData(years, months, days, hours, depth, agg, station, distanceToStation) const interpolation = d3[`interpolate${color}`] || d3.interpolateRgb; const colorScale = createColorScale(data, measurement, interpolation); const legend = createLegend(measurement, colorScale); const rScale = createRScale(data, measurement, range) return mapboxD3({ features: data.features, fill: (d) => colorScale(+d.properties[measurement]), legend, width: width, height: height, mapboxOptions: { center: [-122.1194, 37.8249], // Default center zoom: 8.6, style: "mapbox://styles/mapbox/light-v10", scrollZoom: false, dragPan: false, }, r: (d) => rScale(+d.properties[measurement]), collide: collide, parentInvalidation: invalidation, }); }48:T4f0,function createHorizonTSPlot({ years, depth, agg, station, distanceToStation, granularity, measurement, width, // width/2-5 height, bands, }) { const data = filterAndAggregateTSData(years, depth, agg, station, distanceToStation, granularity); const step = +(d3.max(data, (d) => d[measurement]) / bands).toPrecision(2); return Plot.plot({ label: measurement, height: height, width: width, x: { axis: "top" }, y: { domain: [0, step], axis: null }, fy: { axis: null, domain: data.map((d) => d.Station), padding: 0.05 }, color: { type: "sequential", // "diverging", "sequential", "ordinal" scheme: "Cividis", // "YlGnBu", "Blues", //"YlGnBu", tickFormat: (i) => ((i + 1) * step).toLocaleString("en"), legend: true, }, marks: [ ...d3.range(bands).map((band) => Plot.areaY(data, { x: "Date", y: (d) => d[measurement] - band * step, fy: "Station", fill: band, sort: "Date", clip: true, }) ), Plot.axisFy({ frameAnchor: "left", dx: -28, fill: "currentColor", textStroke: "white", label: null, }), Plot.frame(), ], }); }49:T170b,function filterAndAggregateTSData(years, depth, agg, station, distanceToStation, granularity) { let stations; if (stationsFlag === "current") { stations = currentStations; } else { stations = allStations; } const nearbyStationStations = filterStationsByDistance(station, distanceToStation); const filteredStations = stations.filter(station => nearbyStationStations.includes(station)); const filteredTSWaterData = waterData.filter(d => d.Year >= years[0] && d.Year <= years[1] && d.Depth >= depth[0] && d.Depth <= depth[1] && filteredStations.includes(d.Station) ); const keyTSWaterData0 = filteredTSWaterData.map(obj => { return { key: `${obj.Station}_${obj.Year}_${obj.HalfYear}_${obj.Season}_${obj.Month}_${obj.Day}`, ...obj, }; }); const groupedTSWaterData0 = d3.rollup( keyTSWaterData0, (v) => { const result = {}; for (const measurement of measurements) { const accessor = (d) => +d[measurement]; // Convert to number const measurementValues = v.map((d) => accessor(d)).filter((value) => !isNaN(value)); result[`${measurement}`] = aggFun(measurementValues, (d) => d, agg); } return result; }, (d) => d.key ); const aggTSWaterData0 = Array.from(groupedTSWaterData0, ([key, obj]) => { const [Station, Year, HalfYear, Season, Month, Day] = key.split('_'); return { Station, Year: +Year, HalfYear, Season, Month: +Month, Day: +Day, ...obj, }; }); const keyTSWaterData = aggTSWaterData0.map(obj => { if (granularity === "Month") { return { key: `${obj.Station}_${obj.Year}_${obj.Month}`, ...obj, }; } else if (granularity === "Year") { return { key: `${obj.Station}_${obj.Year}`, ...obj, }; } else if (granularity === "HalfYear") { if (obj.HalfYear === "Cold" && obj.Month > 9) { return { key: `${obj.Station}_${obj.Year+1}_${obj.HalfYear}`, // its cold Year+1 (basically 1.1.Year+1) ...obj, }; } else { return { key: `${obj.Station}_${obj.Year}_${obj.HalfYear}`, ...obj, }; } } else if (granularity === "Season") { if (obj.Season === "Winter" && obj.Month > 11) { return { key: `${obj.Station}_${obj.Year+1}_${obj.Season}`, // its Winter Year+1 (basically 15.1.Year+1) ...obj, }; } else { return { key: `${obj.Station}_${obj.Year}_${obj.Season}`, ...obj, }; } } else if (granularity === "Day") { return { key: `${obj.Station}_${obj.Year}_${obj.Month}_${obj.Day}`, ...obj, }; } }); const groupedTSWaterData = d3.rollup( keyTSWaterData, (v) => { const result = {}; for (const measurement of measurements) { if (measurement === 'None') { continue; } const accessor = (d) => +d[measurement]; // Convert to number const measurementValues = v.map((d) => accessor(d)).filter((value) => !isNaN(value)); result[`${measurement}`] = aggFun(measurementValues, (d) => d, agg); } return result; }, (d) => d.key ); const aggTSWaterData = Array.from(groupedTSWaterData, ([key, obj]) => { if (granularity === "Month") { const [Station, Year, Month] = key.split('_'); return { Station, Year: +Year, Month: +Month, ...obj, }; } else if (granularity === "Year") { const [Station, Year] = key.split('_'); return { Station, Year: +Year, ...obj, }; } else if (granularity === "HalfYear") { const [Station, Year, HalfYear] = key.split('_'); return { Station, Year: +Year, HalfYear, ...obj, }; } else if (granularity === "Season") { const [Station, Year, Season] = key.split('_'); return { Station, Year: +Year, Season, ...obj, }; } else if (granularity === "Day") { const [Station, Year, Month, Day] = key.split('_'); return { Station, Year: +Year, Month: +Month, Day: +Day, ...obj, }; } }); const dateParser = d3.timeParse('%Y-%m-%d') const aggDatedTSWaterData = aggTSWaterData.map(d => { if (granularity === "Month") { return { ...d, Date: dateParser(`${d.Year}-${d.Month}-15`), }; } else if (granularity === "Year") { return { ...d, Date: dateParser(`${d.Year}-7-1`), }; } else if (granularity === "HalfYear") { if (d.HalfYear === "Cold") { return { ...d, Date: dateParser(`${d.Year}-1-1`), }; } else if (d.HalfYear === "Warm") { return { ...d, Date: dateParser(`${d.Year}-7-1`), }; } } else if (granularity === "Season") { if (d.Season === "Spring") { return { ...d, Date: dateParser(`${d.Year}-4-15`), }; } else if (d.Season === "Summer") { return { ...d, Date: dateParser(`${d.Year}-7-15`), }; } else if (d.Season === "Fall") { return { ...d, Date: dateParser(`${d.Year}-10-15`), }; } else if (d.Season === "Winter") { return { ...d, Date: dateParser(`${d.Year}-1-15`), }; } } else if (granularity === "Day") { return { ...d, Date: dateParser(`${d.Year}-${d.Month}-${d.Day}`), }; } else { return d; } }); // const stationsTSWaterData = d3.group(aggDatedTSWaterData, d => d.Station); return aggDatedTSWaterData; }4a:T779,function filterAndAggregateStationData(years, months, days, hours, depth, agg, station, distanceToStation) { let stations; if (stationsFlag === "current") { stations = currentStations; } else { stations = allStations; } const adjustedHours = adjustRangeHours(hours[0], hours[1]); const adjustedMonths = adjustRangeMonths(months[0], months[1]); const nearbyStationStations = filterStationsByDistance(station, distanceToStation); const filteredStations = stations.filter(station => nearbyStationStations.includes(station)); const filteredWaterData = waterData.filter(d => d.Year >= years[0] && d.Year <= years[1] && d.Day >= days[0] && d.Day <= days[1] && d.Depth >= depth[0] && d.Depth <= depth[1] && ( (adjustedHours[0] <= adjustedHours[1] && (d.Hour >= adjustedHours[0] && d.Hour <= adjustedHours[1])) || (adjustedHours[0] > adjustedHours[1] && (d.Hour >= adjustedHours[0] || d.Hour <= adjustedHours[1])) ) && ( (adjustedMonths[0] <= adjustedMonths[1] && (d.Month >= adjustedMonths[0] && d.Month <= adjustedMonths[1])) || (adjustedMonths[0] > adjustedMonths[1] && (d.Month >= adjustedMonths[0] || d.Month <= adjustedMonths[1])) ) && filteredStations.includes(d.Station) ); const aggWaterData = d3.rollup( filteredWaterData, (v) => { const result = {}; for (const measurement of measurements) { if (measurement === 'None') { continue; } const accessor = (d) => +d[measurement]; // Convert to number const measurementValues = v.map((d) => accessor(d)).filter((value) => !isNaN(value)); result[`${measurement}`] = aggFun(measurementValues, (d) => d, agg); } return result; }, (d) => +d.Station ); const updatedSamplingStations = updateFeatures(samplingStations, aggWaterData); return updatedSamplingStations; }4b:T6d0,waterData = FileAttachment("SFBay_processed@3.csv").csv().then(data => data.map(d => ({ ...d, Year: +d.Year || NaN, Month: +d.Month || NaN, Hour: +d.Hour || NaN, Day: +d.Day || NaN, Station: d.Station || NaN, 'Distance.from.36': +d['Distance.from.36'] || NaN, Depth: +d.Depth || NaN, 'Discrete.Chlorophyll': +d['Discrete.Chlorophyll'] || NaN, 'Chlorophyll.a.a.PHA': +d['Chlorophyll.a.a.PHA'] || NaN, Fluorescence: +d.Fluorescence || NaN, 'Calculated.Chlorophyll': +d['Calculated.Chlorophyll'] || NaN, 'Discrete.Oxygen': +d['Discrete.Oxygen'] || NaN, 'Oxygen.Electrode.Output': +d['Oxygen.Electrode.Output'] || NaN, 'Oxygen.Saturation.percent': +d['Oxygen.Saturation.percent'] || NaN, 'Calculated.Oxygen': +d['Calculated.Oxygen'] || NaN, 'Discrete.SPM': +d['Discrete.SPM'] || NaN, 'Optical.Backscatter': +d['Optical.Backscatter'] || NaN, 'Calculated.SPM': +d['Calculated.SPM'] || NaN, 'Measured.Extinction.Coefficient': +d['Measured.Extinction.Coefficient'] || NaN, 'Calculated.Extinction.Coefficient': +d['Calculated.Extinction.Coefficient'] || NaN, Salinity: +d.Salinity || NaN, Temperature: +d.Temperature || NaN, 'Sigma.t': +d['Sigma.t'] || NaN, Nitrite: +d.Nitrite || NaN, 'Nitrate...Nitrite': +d['Nitrate...Nitrite'] || NaN, Ammonium: +d.Ammonium || NaN, Phosphate: +d.Phosphate || NaN, Silicate: +d.Silicate || NaN, Season: classifySeason(d.Month), HalfYear: classifyHalfYear(d.Month), Date: d3.timeParse("%Y-%m-%d")(d.Date), TimeStamp: d3.timeParse("%Y-%m-%d %H:%M:%S")(d.TimeStamp), Time: d3.timeParse("%H:%M:%S")(d.Time) // Add more conversions or classifications as needed })) ); 4c:T1a40,function* mapboxD3({ width = 900, //900, height = 600, features = [], // geoJSON features to draw id = (d, i) => i, r = null, // If not null, must be a function that returns the radius in pixels given the datum fill = null, // If not null, must be a function that returns the color given the datum legend = null, legendPosition = [10, 10], stroke = "#777", mapboxOptions = { style: "mapbox://styles/mapbox/light-v10", scrollZoom: true }, // container = d3.select(html`

`), // where to draw container = html`

`, // where to draw d3Background = null, delay = null, transitionDuration = 0, collide = false, alphaRestart = 0.3, // Alpha to set before restarting if using simulation collide = true parentInvalidation = invalidation, strokeWidth = 1, controls = false // Should display zooming controls } = {}) { let selected = null, // clicked element loaded = false; // has mapbox finished loading let rScale = null, colorScale = null, _r = r, simulation = null, hoverObj; let dots; if (!r) { rScale = d3 .scaleSqrt() .domain([0, d3.max(features, (d) => d?.properties?.value)]) .range([0, 15]); _r = (d) => rScale(d?.properties?.value); } if (!fill) { colorScale = colorScale || d3 .scaleSequential(d3.interpolateInferno) .domain([0, d3.max(features, (d) => d?.properties?.value)]); fill = (d) => colorScale(d?.properties?.value); } yield container; // Give the container dimensions. const map = (container.value = new mapboxgl.Map({ container, ...mapboxOptions })); // Setup our svg layer that we can manipulate with d3 const bb = container.getBoundingClientRect(); const svg = d3 .select(container) .append("svg") .attr("class", "d3Mapbox") .style("position", "absolute") .style("top", 0) .style("left", 0) // .attr("width", bb.width) // .attr("height", bb.height) .attr("width", width) .attr("height", height) .style("background", d3Background) .style("pointer-events", "none"); // the svg shouldn't capture mouse events, so we can have pan and zoom from mapbox //Project any point to map's current state function projectPoint(lon, lat) { let point = map.project(new mapboxgl.LngLat(lon, lat)); this.stream.point(point.x, point.y); } if (legend) { svg .append("g") .attr("transform", "translate(20, 20)") .append(() => legend ); } //Projection function let transform = d3.geoTransform({ point: projectPoint }); let path = d3.geoPath().projection(transform); svg.append("style").text(` circle.highlight { stroke: red; } `); const updateDots = (features) => { const dots = svg .selectAll(".feature") .data(features, id) .join(r ? "circle" : "path") .attr("class", "feature") .attr("stroke", stroke) .attr("stroke-width", strokeWidth) .on("click", (evt, d) => (selected = d)) .style("pointer-events", "all"); // hello-tippy needs nodes if (dots.nodes().length) { hoverObj = hover(dots, invalidation, { raise: false }); } return dots; }; dots = updateDots(features); const getTransition = () => { let t = dots; if (transitionDuration || delay) { t = t.transition().duration(transitionDuration).delay(delay); } return t; }; const update = () => { hoverObj && hoverObj.reset(); if (r) { let t = getTransition(); t.attr("r", _r); if (collide) { features.forEach((d) => (d.foci = path.centroid(d))); simulation.nodes(features); simulation.alpha(alphaRestart).restart(); } else { t.attr("cx", (d) => path.centroid(d)[0]).attr( "cy", (d) => path.centroid(d)[1] ); } } else { dots.attr("d", path); } dots.attr("fill", fill); dots.attr("stroke", stroke); }; // Positioning if (collide) { // Position nodes via simulation; features.forEach((d) => (d.foci = path.centroid(d))); simulation = Simulation(features, { clone: false, x: (d) => d?.foci[0], y: (d) => d?.foci[1], r, parentInvalidation, tick: () => { getTransition() .attr("r", _r) .attr("cx", (d) => d.x) .attr("cy", (d) => d.y); } }); } else { //position nodes manually; if (r) { dots .attr("r", _r) .attr("cx", (d) => path.centroid(d)[0]) .attr("cy", (d) => path.centroid(d)[1]); } else { dots.attr("d", path); } } // Parameters to return function set() { container.value = { transform, path, map, dots, hoverObj, selected, loaded, update, simulation, set r(_) { rScale = null; _r = _; if (collide) simulation.updateForces({ newR: _r }); }, get r() { return r; }, set fill(_) { colorScale = null; fill = _; }, get fill() { return fill; }, set rScale(_) { rScale = _; if (collide) simulation.nodes(features); }, get rScale() { return rScale; }, set colorScale(_) { colorScale = _; }, get colorScale() { return colorScale; }, set delay(_) { delay = _; }, get delay() { return delay; }, set features(_) { features = _; dots = updateDots(features); }, set width(_) { width = _; svg.attr("width", width).attr("height", height); }, set height(_) { height = _; svg.attr("width", width).attr("height", height); } }; container.dispatchEvent(new Event("input", { bubbles: true })); } if (!map) return; // Every time the map changes, update the dots map.on("viewreset", update); map.on("move", update); map.on("moveend", update); map.on("load", () => { loaded = true; set(); update(); }); parentInvalidation.then(() => { map.off("viewreset", update); map.off("move", update); map.off("moveend", update); map.remove(); }); if (controls) { // Add zoom and rotation controls to the map. map.addControl(new mapboxgl.NavigationControl()); } // disable map rotation using right click + drag map.dragRotate.disable(); // disable map rotation using touch rotation gesture map.touchZoomRotate.disableRotation(); update(); set(); return container; }4d:T43f,function Simulation( data, { warmup = 200, strengthY = 0.3, strengthX = 0.3, r = () => 3, tick = () => {}, x = () => 0, y = () => 0, clone = true, parentInvalidation } = {} ) { // return Generators.observe((notify) => { const nodes = clone ? [...data.map((d) => ({ ...d }))] : data; const simulation = d3.forceSimulation(nodes); // To be able to update the forces simulation.updateForces = ({ newX = x, newY = y, newR = r } = {}) => { x = newX; y = newY; r = newR; simulation .force("x", d3.forceX(x).strength(strengthX)) .force("y", d3.forceY(y).strength(strengthY)) .force("collide", d3.forceCollide(r)); }; simulation.updateForces(x, y, r); if (warmup) { simulation.stop(); for (let i = 0; i < warmup; i++) { simulation.tick(); } } simulation.restart(); simulation.on("tick", () => { // notify(nodes); // console.log(nodes[0]); tick(nodes); }); // notify(nodes); parentInvalidation.then(() => simulation.stop()); // }); return simulation; }4e:[{"id":"427d81f8ebf9e088ef4a1692bf60fe9c2d65ff4e4465ae273710a881e62b018d3c2eb283efff0eaeba5bd42aeb39bf226b1cdc07fb175a5f3907ce290727398d","href":"https://static.observableusercontent.com/files/427d81f8ebf9e088ef4a1692bf60fe9c2d65ff4e4465ae273710a881e62b018d3c2eb283efff0eaeba5bd42aeb39bf226b1cdc07fb175a5f3907ce290727398d","name":"stations@1.geojson","type":"application/geo+json","lastModified":1701521729085.398,"size":9108},{"id":"8d1dc5c68c56bd072b8d66e46fc0a5a8b70b35b083bf8f5f62baf354c43a15199fe6b954ad17502c680f073a38adce342560fb29b2d90fc5b8551a66857ddc22","href":"https://static.observableusercontent.com/files/8d1dc5c68c56bd072b8d66e46fc0a5a8b70b35b083bf8f5f62baf354c43a15199fe6b954ad17502c680f073a38adce342560fb29b2d90fc5b8551a66857ddc22","name":"distance_matrix@4.csv","type":"text/csv","lastModified":1701769890475.836,"size":11622},{"id":"2976c5c742da06bdc1121e34b916d81bfff0b1d70763a24b5e7b3f3b4462c04d48cf85450a674f2c0e66aedbdf843c86b1be899f5da3fb50bf540e094e0ae846","href":"https://static.observableusercontent.com/files/2976c5c742da06bdc1121e34b916d81bfff0b1d70763a24b5e7b3f3b4462c04d48cf85450a674f2c0e66aedbdf843c86b1be899f5da3fb50bf540e094e0ae846","name":"SFBay_processed@3.csv","type":"text/csv","lastModified":1701628529378.902,"size":24273209}] 44:{"id":"2660b3606c29af1e","slug":"sf-bay-water-quality","title":"SF Bay Water Quality","thumbnail":"37ce1b29f84bffd5febfe7dab86a59c70f5db72a0bb22e6476e2b22abb472eef","access_level":"public","create_time":"$D2023-12-01T16:41:46.973Z","update_time":"$D2023-12-19T12:32:41.539Z","view_time":null,"first_public_time":"$D2023-12-09T15:16:07.139Z","has_unpublished_edits":null,"fork":{"id":"37e242fa08c17468","slug":"mapbox-d3","title":"Mapbox D3","owner":{"id":"cd3c1e49fc84d010","login":"john-guerra","name":"John Alexis Guerra Gómez"}},"stars":0,"starred":false,"owner":{"type":"team","id":"be7f5f0d7115c705","login":"simon-konzett-ws","name":"Simon Konzett's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/74f696125bb27026f2c7cf965768b0029003181c6b383e602f458233d5f54fe5","tier":"starter_2024","bio":"","following":false},"version":2882,"publish_version":null,"role":null,"authored":false,"authors":[{"type":"individual","id":"99e3a02e08a74ba8","login":"simon-konzett","name":"Simon Konzett","avatar_url":"https://avatars-next.observableusercontent.com/1eb3cfc97c7bd7b5a6269561f911bd3b45b2229451427a71b9f9cb47f05f3e1e","tier":null,"bio":"","following":false}],"members":[{"type":"individual","id":"99e3a02e08a74ba8","login":"simon-konzett","name":"Simon Konzett","avatar_url":"https://avatars-next.observableusercontent.com/1eb3cfc97c7bd7b5a6269561f911bd3b45b2229451427a71b9f9cb47f05f3e1e","tier":null,"role":"editor"},{"type":"team","id":"be7f5f0d7115c705","login":"simon-konzett-ws","name":"Simon Konzett's Workspace","avatar_url":"https://avatars-next.observableusercontent.com/74f696125bb27026f2c7cf965768b0029003181c6b383e602f458233d5f54fe5","tier":"starter_2024","role":"editor"}],"comments":[],"custom_thumbnail":false,"trashed":false,"lapsed":null,"subscribed":null,"forks":0,"collection":null,"type":"notebook","body":{"titling":"auto","title":"SF Bay Water Quality","cells":[{"id":0,"value":"# SF Bay Water Quality\n\nDiscover the intricacies of San Francisco Bay's water quality through our advanced visualization tool. The tool offers a detailed physical map showcasing various water quality parameters, with robust filtering options enabling users to focus on specific timeframes and locations.\n\nDive into the data analysis with TimeSeries plots, providing nuanced insights through stacked and horizon views. The tool also facilitates the comparison of maps featuring distinct measurement locations and timelines. Integration with corresponding TimeSeries plots enhances the analytical depth, offering a holistic understanding of water quality dynamics.\n\nThis visualization tool caters to researchers, decision-makers, and enthusiasts, providing a sophisticated yet user-friendly platform to unravel the complexities of San Francisco Bay's water quality. Explore, analyze, and gain valuable insights into the evolving patterns within this iconic bay.","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":680,"value":"## Visualization","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1624,"value":"$46","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2879,"value":"## Main reference\n\n```js\nimport {mapboxD3} from \"@john-guerra/mapbox-d3\"\n```","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":2210,"value":"## Visualisation functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":2208,"value":"$47","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2719,"value":"function createStackedTSPlot({\n years, \n depth, \n agg, \n station, \n distanceToStation, \n granularity,\n measurement,\n width,\n height,\n order,\n reverse,\n}) \n{\n const data = filterAndAggregateTSData(years, depth, agg, station, distanceToStation, granularity);\n return Plot.plot({\n width: width,\n height: height,\n y: {\n grid: true,\n label: measurement,\n },\n color: { legend: true },\n marks: [\n Plot.areaY(\n data,\n Plot.stackY(\n { order, reverse },\n { x: \"Date\", y: measurement, fill: \"Station\" } // z: \"Station\",\n )\n ),\n Plot.ruleY([0]),\n ],\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2725,"value":"$48","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2249,"value":"### Maps","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":2250,"value":"mutable mapSamplingStations = (false) ? createMapSamplingStations({\n years: years1,\n months: months1,\n days: days1,\n hours: hours1,\n depth: depth1,\n agg: agg1,\n station: station1,\n distanceToStation: distanceToStation1,\n measurement: measurement1,\n color: \"Reds\",\n range: [3,12],\n width: width,\n collide: true,\n})\n: html``;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2257,"value":"mutable mapSamplingStationsLeft = \n(mode === \"Map\") \n ? createMapSamplingStations({\n years: years1,\n months: months1,\n days: days1,\n hours: hours1,\n depth: depth1,\n agg: agg1,\n station: station1,\n distanceToStation: distanceToStation1,\n measurement: measurement1,\n color: \"Cividis\", // \"Blues\",\n range: [3,12],\n width: width/2 - 5,\n height: height,\n collide: true,\n })\n : html``;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2260,"value":"mutable mapSamplingStationsRight = \n (mode === \"Map\" && measurement2 !== \"None\") \n ? createMapSamplingStations({ \n years: years2,\n months: months2,\n days: days2,\n hours: hours2,\n depth: depth2,\n agg: agg2,\n station: station2,\n distanceToStation: distanceToStation2,\n measurement: measurement2,\n color: \"Magma\",\n range: [3,12],\n width: width/2 - 5,\n height: height,\n collide: true,\n })\n : html``;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2717,"value":"### TS Plots","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":2731,"value":"mutable stackedTSPlot = \n(mode === \"TS\" || (measurement2 === \"None\" && ts === \"Stacked\")) \n ? createStackedTSPlot({\n years: years1, \n depth: depth1,\n agg: agg1,\n station: station1,\n distanceToStation: distanceToStation1,\n granularity: granularity1,\n measurement: measurement1,\n width: width/2 - 5,\n height: 0.9 * height,\n order: \"acceptance\",\n reverse: true,\n })\n : html``;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2737,"value":"mutable horizonTSPlot = \n(mode === \"TS\" || (measurement2 === \"None\" && ts === \"Horizon\")) \n ? createHorizonTSPlot({\n years: years1, \n depth: depth1,\n agg: agg1,\n station: station1,\n distanceToStation: distanceToStation1,\n granularity: granularity1,\n measurement: measurement1,\n width: width/2 - 5,\n height: 0.9 * height,\n bands: 4,\n })\n : html``;","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2114,"value":"## Data processing","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1842,"value":"$49","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2119,"value":"$4a","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2126,"value":"function filterStationsByDistance(key, r,) {\n \n // Check if the key exists in the distance map\n if (!distanceMap.has(key)) {\n return [];\n }\n\n // Get distances associated with the key\n const distances = distanceMap.get(key);\n\n // Filter features based on the threshold\n const filteredFeatures = Object.entries(distances)\n .filter(([feature, value]) => typeof value === 'number' && value <= r)\n .map(([feature]) => feature);\n\n return filteredFeatures;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2122,"value":"## Util functions","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":1862,"value":"function getUniqueStations(data) {\n const uniqueStationsSet = new Set(data.map(obj => obj.Station));\n const uniqueStationsArray = Array.from(uniqueStationsSet);\n return uniqueStationsArray;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2193,"value":"convertStationToNumeric = (geojson) => {\n return {\n type: geojson.type,\n features: geojson.features.map(feature => ({\n type: feature.type,\n geometry: feature.geometry,\n properties: {\n ...feature.properties,\n Station: +feature.properties.Station\n }\n }))\n };\n};","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":876,"value":"function classifySeason(month) {\n // Classify the month into seasons\n if (month >= 3 && month <= 5) {\n return 'Spring';\n } else if (month >= 6 && month <= 8) {\n return 'Summer';\n } else if (month >= 9 && month <= 11) {\n return 'Fall';\n } else {\n return 'Winter';\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2043,"value":"function classifyHalfYear(month) {\n // Classify the month into seasons\n if (month >= 4 && month <= 9) {\n return 'Warm';\n } else {\n return 'Cold';\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1150,"value":"function monthToNumber(monthName) {\n const monthMap = {\n January: 1,\n February: 2,\n March: 3,\n April: 4,\n May: 5,\n June: 6,\n July: 7,\n August: 8,\n September: 9,\n October: 10,\n November: 11,\n December: 12,\n };\n\n // Convert the month name to its corresponding number using the monthMap\n return monthMap[monthName];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1179,"value":"function numberToMonth(monthNumber) {\n const monthMap = {\n 1: 'January',\n 2: 'February',\n 3: 'March',\n 4: 'April',\n 5: 'May',\n 6: 'June',\n 7: 'July',\n 8: 'August',\n 9: 'September',\n 10: 'October',\n 11: 'November',\n 12: 'December',\n };\n\n // Check if the month number is valid (between 1 and 12)\n if (monthNumber < 1 || monthNumber > 12) {\n throw new Error('Invalid month number: ' + monthNumber);\n }\n\n // Return the corresponding month name using the monthMap\n return monthMap[monthNumber];\n}\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1324,"value":"function adjustRangeHours(start, end) {\n const adjustedStart = start > 24 ? start - 25 : start - 1;\n const end2 = end > start + 23 ? start + 23 : end;\n const adjustedEnd = end2 > 24 ? end2 - 25 : end2 - 1;\n return [adjustedStart, adjustedEnd];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1345,"value":"function adjustRangeMonths(start, end) {\n const adjustedStart = start > 12 ? start - 12 : start;\n const end2 = end > start + 11 ? start + 11 : end;\n const adjustedEnd = end2 > 12 ? end2 - 12 : end2;\n return [adjustedStart, adjustedEnd];\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2013,"value":"function createRScale(data, measurement, range) {\n const minMeasurement = d3.min(data.features, (d) => +d.properties[measurement]);\n const maxMeasurement = d3.max(data.features, (d) => +d.properties[measurement]);\n\n return d3\n .scaleSqrt()\n .domain([minMeasurement, maxMeasurement])\n .range(range);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2022,"value":"function createColorScale(data, measurement, interpolation) {\n const minMeasurement = d3.min(data.features, (d) => +d.properties[measurement]);\n const maxMeasurement = d3.max(data.features, (d) => +d.properties[measurement]);\n\n return d3.scaleSequential(interpolation)\n .domain([minMeasurement, maxMeasurement]);\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2019,"value":"function createLegend(measurement, colorScale) {\n return Legend(colorScale, {\n title: measurement\n });\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2199,"value":"function aggFun(v, accessor, agg) {\n switch (agg) {\n case 'median':\n return d3.median(v, accessor);\n case 'mean':\n return d3.mean(v, accessor);\n case 'max':\n return d3.max(v, accessor);\n case 'min':\n return d3.min(v, accessor);\n // Add more cases for other aggregation functions as needed\n default:\n throw new Error(`Unsupported aggregation function: ${agg}`);\n }\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2203,"value":"function updateFeatures(stations, waterData) {\n const stationsArray = stations.features || [];\n\n const updatedFeatures = stationsArray.map(station => {\n const waterValues = waterData.get(station.properties.Station) || {};\n return { ...station, properties: { ...station.properties, ...waterValues } };\n })\n // Deep copy the originalStations to avoid modifying the input\n const updatedStations = JSON.parse(JSON.stringify(stations));\n\n // Replace features in newSamplingStations with the updated features\n updatedStations.features = updatedFeatures;\n\n return updatedStations;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2554,"value":"## User input elements","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":2673,"value":"viewof mode = Inputs.radio([\"Map\", \"TS\"], {value: \"Map\", label: html`Visualization mode`})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2578,"value":"viewof mapParams = Inputs.radio([\"Basic\", \"Some\", \"More\", \"All\"], {value: \"Some\", label: html`Show parameters`})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2587,"value":"viewof stationsFlag = Inputs.radio([\"all\", \"current\"], {value: \"current\", label: html`All / Current stations`})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2608,"value":"viewof measurement1 = Inputs.select([\"None\", ...measurements], {label: html`Measurement 1`})// ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2572,"value":"viewof measurement2 = Inputs.select([\"None\", ...measurements], {label: html`Measurement 2`})// ","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2562,"value":"viewof years1 = interval([1969, 2014], {\n step: 1,\n value: [1969, 2014],\n format: ([start, end]) => {\n return html`Years: ${start} ... ${end}`;\n },\n // width: sliderWidth,\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2610,"value":"viewof years2 = interval([1969, 2014], {\n step: 1,\n value: [1969, 2014],\n format: ([start, end]) => {\n return html`Years: ${start} ... ${end}`;\n },\n // width: sliderWidth,\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2559,"value":"viewof months1 = interval([1, 24], {\n step: 1,\n value: [7, 18],\n format: ([start, end]) => {\n const [adjustedStart, adjustedEnd] = adjustRangeMonths(start, end);\n return html`Months: ${numberToMonth(adjustedStart)} ... ${numberToMonth(adjustedEnd)}`;\n },\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2613,"value":"viewof months2 = interval([1, 24], {\n step: 1,\n value: [7, 18],\n format: ([start, end]) => {\n const [adjustedStart, adjustedEnd] = adjustRangeMonths(start, end);\n return html`Months: ${numberToMonth(adjustedStart)} ... ${numberToMonth(adjustedEnd)}`;\n },\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2551,"value":"viewof days1 = interval([1, 31], {\n step: 1,\n value: [1, 31],\n format: ([start, end]) => {\n return html`Days: ${start} ... ${end}`;\n },\n // width: sliderWidth,\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2616,"value":"viewof days2 = interval([1, 31], {\n step: 1,\n value: [1, 31],\n format: ([start, end]) => {\n return html`Days: ${start} ... ${end}`;\n },\n // width: sliderWidth,\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2565,"value":"viewof hours1 = interval([1, 48], {\n step: 1,\n value: [12, 35],\n format: ([start, end]) => {\n const [adjustedStart, adjustedEnd] = adjustRangeHours(start, end);\n return html`Hours: ${adjustedStart} ... ${adjustedEnd}`;\n },\n // width: sliderWidth,\n // label: 'Hours',\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2619,"value":"viewof hours2 = interval([1, 48], {\n step: 1,\n value: [12, 35],\n format: ([start, end]) => {\n const [adjustedStart, adjustedEnd] = adjustRangeHours(start, end);\n return html`Hours: ${adjustedStart} ... ${adjustedEnd}`;\n },\n // width: sliderWidth,\n // label: 'Hours',\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2569,"value":"viewof depth1 = interval([0, maxDepth], {\n step: 0.25,\n value: [0, maxDepth],\n format: ([start, end]) => {\n return html`Depth: ${start} ... ${end} m`;\n },\n // width: sliderWidth,\n // label: 'Depth',\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2623,"value":"viewof depth2 = interval([0, maxDepth], {\n step: 0.25,\n value: [0, maxDepth],\n format: ([start, end]) => {\n return html`Depth: ${start} ... ${end} m`;\n },\n // width: sliderWidth,\n // label: 'Depth',\n});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2575,"value":"viewof agg1 = Inputs.radio([\"median\", \"min\", \"max\"], {value: \"median\", label: html`Aggregation method`});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2627,"value":"viewof agg2 = Inputs.radio([\"median\", \"min\", \"max\"], {value: \"median\", label: html`Aggregation method`});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2581,"value":"viewof station1 = Inputs.select(currentStations, {value: \"36.0\", label: html`Station / Radius`});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2630,"value":"viewof station2 = Inputs.select(currentStations, {value: \"2.0\", label: html`Station / Radius`});","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2584,"value":"viewof distanceToStation1 = Inputs.range([0, maxD1], {step: 0.25, value: maxD1})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2633,"value":"viewof distanceToStation2 = Inputs.range([0, maxD2], {step: 0.25, value: maxD2})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2590,"value":"viewof granularity1 = Inputs.radio([\"Year\", \"HalfYear\", \"Season\", \"Month\", \"Day\"], {label: html`Aggregation granularity`, value: \"Season\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2638,"value":"viewof granularity2 = Inputs.radio([\"Year\", \"HalfYear\", \"Season\", \"Month\", \"Day\"], {label: html`Aggregation granularity`, value: \"Season\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2768,"value":"viewof ts = Inputs.radio([\"Horizon\", \"Stacked\"], {label: html`Stacked / Horizon Chart`, value: \"Horizon\"})","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2151,"value":"## Data","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":2155,"value":"distanceMap = FileAttachment(\"distance_matrix@4.csv\").csv().then(data => {\n // Process the data and create a map with Station as keys\n const distanceMap = new Map(data.map(({ Station, ...rest }) => [Station, rest]));\n\n // Convert values to numeric and round to two decimals without modifying feature names\n for (const [station, distances] of distanceMap) {\n const roundedDistances = {};\n for (const [key, value] of Object.entries(distances)) {\n roundedDistances[key] = isNaN(value) ? value : Math.round(value * 100) / 100;\n }\n distanceMap.set(station, roundedDistances);\n }\n\n return distanceMap;\n});","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2160,"value":"$4b","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2190,"value":"rawSamplingStations = FileAttachment(\"stations@1.geojson\").json()","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2314,"value":"samplingStations = convertStationToNumeric(rawSamplingStations);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2178,"value":"currentStations = [\n \"657.0\", \"649.0\", \"2.0\", \"3.0\", \"4.0\", \"5.0\", \"6.0\", \"7.0\", \"8.0\", \"9.0\",\n \"10.0\", \"11.0\", \"12.0\", \"13.0\", \"14.0\", \"15.0\", \"16.0\", \"17.0\", \"18.0\", \"20.0\",\n \"21.0\", \"22.0\", \"23.0\", \"24.0\", \"25.0\", \"26.0\", \"27.0\", \"28.0\", \"29.0\", \"29.5\",\n \"30.0\", \"31.0\", \"32.0\", \"33.0\", \"34.0\", \"35.0\", \"36.0\"\n];","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2182,"value":"allStations = getUniqueStations(waterData);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2135,"value":"## Vars","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":2185,"value":"measurements = Object.keys(waterData[0]).slice(4, 25);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2165,"value":"height = 600","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2167,"value":"maxDepth = d3.max(waterData, d => d.Depth);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2296,"value":"maxDistances = new Map(\n [...distanceMap].map(([station, distances]) => [\n station,\n Math.max(...Object.values(distances)),\n ])\n);","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2294,"value":"maxD1 = maxDistances.get(station1)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2641,"value":"maxD2 = maxDistances.get(station2)","pinned":true,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2131,"value":"## Mapbox","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":319,"value":"$4c","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":595,"value":"$4d","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":2133,"value":"## Imports and stuff","pinned":false,"hidden":false,"mode":"md","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"","database":"$undefined"},{"id":410,"value":"topojson = require(\"topojson-server@3\", \"topojson-simplify@3\", \"topojson-client@3\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":332,"value":"function tipcontent(_d) {\n const d = _d.properties;\n return htl.html`\n ${Object.keys(d).map((c) => htl.html`

${c}: ${d[c]}

`)}`;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":325,"value":"import { hover, link } with { tipcontent, tippytheme } from \"@fil/hello-tippy@571\"\n// import { hover, link } with { tipcontent, tippytheme } from \"01649316c88b8149\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1071,"value":"import {interval} from \"@mootari/range-slider\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":1379,"value":"import {Legend} from \"@d3/color-legend\"\n","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":328,"value":"tippytheme = \"light\"","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":11,"value":"d3 = require(\"d3@7\", \"d3-geo-projection\", \"d3-simple-slider\")","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"},{"id":13,"value":"mapboxgl = {\n const gl = await require(\"mapbox-gl\");\n if (!gl.accessToken) {\n gl.accessToken =\n \"pk.eyJ1Ijoiamd1ZXJyYWciLCJhIjoiY2pueW9uMGhzMDA3NDN3bXp5b2Rqbzk1YiJ9.3scgV-j4d394mvOUqtz1XQ\";\n const href = await require.resolve(\"mapbox-gl/dist/mapbox-gl.css\");\n document.head.appendChild(html``);\n }\n return gl;\n}","pinned":false,"hidden":false,"mode":"ojs","author":"$undefined","summary":"$undefined","tool":"$undefined","providerMetadata":"$undefined","attachments":"$undefined","output":"$undefined","database":"$undefined"}],"files":"$W4e","stdlib":"1"}} 45:"$44:body"