Stacked bars with totalQuantize legend ticksD3 contours and Plot spatial interpolatorsDodge valuesPlot: bars and lineSpectrum plotter basicHTML tips (without tippy)Plot: extended interval (#1824)Format yKittenShifted / centered time barsPlot: custom color channel in interactive tipsStreaming FlatGeobuf with PlotChart with a marginal histogramOld faithful: density plot with a side rugDodge textWhite House tweets heatmapMidpoint transformFlow-based cartograms (Gastner, Seguy & More, 2018)A trend line for counts over timePlot sample transformCreate an average line in PlotA centered titlePlot 0.6.0Band scale tickSize
Reading dates
data = FileAttachment("values.csv").csv({ typed: true })
data[0].date // Formatted as "%b %y" (short month name, short year)
values = data.map((d) => ({
date: d3.utcParse("%b %y")(d.date),
value: +d.value
}))
Plot.rectY(values, {
x: "date",
y: "value",
interval: "month" // transforms a date "point" into an interval
}).plot({
marginLeft: 50
})
Plot.barY(data, {
x: "date",
y: "value"
}).plot({
width,
marginLeft: 50,
marginBottom: 60,
x: {
transform: d3.utcParse("%b %y"),
tickRotate: -60,
tickFormat: "%b %y",
interval: "month"
}
})
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.
