Public
Edited
Aug 21, 2024
Insert cell
Insert cell
slope_data = {
// import d3-time-format
const d3 = await require('d3-time-format');

aq.addFunction('parse_mdy', d3.timeParse('%m/%d/%Y %H:%M'), { override: true });

return aq.fromCSV(
await FileAttachment("upwelling_slope.csv").text())
.derive({ datetime: d => op.parse_mdy(d.datetime) })
.derive({ CUTI: d => (d.sst - 15) * d.windspeed }) // Add CUTI column
.derive({ BEUTI: d => d.sst * d.chl }) // Add BEUTI column
}
Insert cell
Insert cell
Insert cell
Plot.plot({
marks: [
Plot.gridX({ticks: d3.utcMonth.every(1)}),
Plot.axisX({ticks: d3.utcMonth.every(1), tickFormat: "%B", tickSize: 14, tickPadding: -10, textAnchor: "start"}),
Plot.lineY(slope_data, {x: "datetime", y: "BEUTI"})
]
})
Insert cell
Insert cell
shelf_data = {
// import d3-time-format
const d3 = await require('d3-time-format');

aq.addFunction('parse_mdy', d3.timeParse('%m/%d/%Y %H:%M'), { override: true });

return aq.fromCSV(
await FileAttachment("upwelling_shelf.csv").text())
.derive({ datetime: d => op.parse_mdy(d.datetime) })
.derive({ CUTI: d => (d.sst - 15) * d.windspeed }) // Add CUTI column
.derive({ BEUTI: d => d.sst * d.chl }) // Add BEUTI column
}
Insert cell
Insert cell
Plot.plot({
marks: [
Plot.gridX({ticks: d3.utcMonth.every(1)}),
Plot.axisX({ticks: d3.utcMonth.every(1), tickFormat: "%B", tickSize: 14, tickPadding: -10, textAnchor: "start"}),
Plot.lineY(shelf_data, {x: "datetime", y: "BEUTI"})
]
})
Insert cell
Insert cell
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more