Public
Edited
Sep 9, 2024
1 star
Insert cell
Insert cell
Plot.plot({
marginLeft: 180,
x: {
type: "linear",
domain: segments,
ticks: segments,
tickFormat: (d) => (d === Math.floor(d) ? `${d}:00` : `${Math.floor(d)}:30`)
},
color: {
scheme: "YlGnBu",
legend: true,
label: "Count (median)"
},
marks: [
Plot.ruleX([12.5], { strokeDasharray: "2,6" }),
Plot.rectX(
bikes,
Plot.binX(
{ fill: "median", interval: 0.25 },
{
x: "time",
y: "location",
fill: "count",
sort: { y: "fill", reverse: true },
tip: true
}
)
)
]
})
Insert cell
Insert cell
bikes = FileAttachment("bikes.csv").csv({ typed: true })
Insert cell
Insert cell
segments = [7, 7.5, 8, 8.5, 9, 16, 16.5, 17, 17.5, 18]
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