pizzaBySales = aq //arquero comes out of the box with ObservableHQ
.from(pizza) //converts the Array of objects into a data table
.groupby("name") //groups the data by the "name" column
.rollup({
value: (d) => op.sum(d.orders) //sum up the orders
})
.orderby(aq.desc("value")) //orders the result by value, the new variable we created with the rollup
.objects() //returns an Array of objects again
pizzaBySalesForPlot = pizzaBySales.slice(0, top).map((d) => d.name)
heatmap = Plot.plot({
width: 720,
height: 300,
marginLeft: 90,
facet: {
data: pizza,
y: "pizza_name",
x: "size"
},
x: { label: "By date" },
fx: { label: "Size", domain: ["Small", "Medium", "Large", "Extra Large"] },
fy: { label: "" },
color: {
scheme: "RdPu",
legend: true,
label: "Number of orders"
},
marks: [
Plot.tickX(
pizza,
Plot.binX(
legend.linked ? { stroke: "sum"} : { fill: "sum"},
{
x: "order_date",
interval: legend.interval.value,
stroke: "orders",
tip: true,
sort: "-stroke"
}
)
),
Plot.frame({ stroke: "#aaa", strokeWidth: 0.5 })
]
})
pizza
Type Table, then Shift-Enter. Ctrl-space for more options.
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.
