Seasoned SQL, JS Dev | Database | MS SQL Server | T-SQL | Azure | Python |
Public
Edited
Jul 23, 2024
csvdata = (async () => {
const response = await fetch(
"https://data.cityofnewyork.us/resource/c3uy-2p5r.csv"
);
return await response.text();
})()
airquality = d3.csvParse(csvdata)
airquality
Type Table, then Shift-Enter. Ctrl-space for more options.
airquality
X
name
Y
mean
data_value
Color
—
Size
—
Facet X
—
Facet Y
—
Mark
bar
Type Chart, then Shift-Enter. Ctrl-space for more options.
Plot.plot({
marks: [
Plot.barY(
airquality,
Plot.groupX(
{
y: "mean",
title: (d) =>
`Mean air quality: ${(
d.reduce((acc, curr) => acc + curr.data_value, 0) / d.length
).toFixed(0)} \n Air particle: ${d[0].name}`
},
{
x: "name",
y: "data_value"
}
)
),
Plot.ruleY([0])
]
})
Plot.plot({
marks: [
Plot.barY(airquality, {
x: "name",
y: "data_value",
sort: { x: "y", reverse: true },
title: "data_value"
}),
Plot.ruleY([0])
],
y: {
grid: true
},
marginLeft: 50,
marginTop: 50,
marginBottom: 50
})
import {Plot} from "@mkfreeman/plot-tooltip"
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.
