Notebooks 2.0 is here.
Published unlisted
Edited
Mar 18, 2022
Plot.plot({
width,
height: 250,
label: null,
x: {
axis: "top",
domain: [start, end]
},
y: {
grid: true
},
marks: [
Plot.ruleX(d3.utcDay.range(start, end), { strokeOpacity: 0.1 }),
Plot.ruleX([today], { stroke: "red" }),
Plot.barX(data, {
y: "NAME",
x: "DATE",
interval: d3.utcDay,
inset: 0, // no gaps between days
fill: "COUNTRY",
title: (d) => `${d.NAME}\n${d.COUNTRY}`,
clip: true
})
]
})
data = FileAttachment("vacation.csv").csv({typed: true})
start = new Date("2022-02-01")
end = new Date("2022-04-01")
today = d3.utcDay()
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.
