Public
Edited
Dec 14, 2023
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
daily_orders
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
stores
Type Table, then Shift-Enter. Ctrl-space for more options.

Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
// Filter rows based on the order_date column (keeping only rows from 2022 onwards)
pizzaDataFiltered = daily_orders_product.filter(({ order_date }) => new Date(order_date).getFullYear() >= 2022);
Insert cell

dailyTotalSales = d3.rollup(
pizzaDataFiltered,
(v) => d3.sum(v, (d) => d.revenue),
(d) => d3.timeWeek(d.order_date)
);
Insert cell
Insert cell
// Sorting the data by date
sortedDailySales = Array.from(dailyTotalSales.entries()).sort(
(a, b) => a[0] - b[0]
);
Insert cell
Insert cell
// array: 'salesData'

// Filtrar datos para el año 2022
salesData2022 = daily_orders.filter(({ order_date }) => new Date(order_date).getFullYear() === 2022);




Insert cell
storeTotalSales = Array.from(d3.rollup(
salesData2022,
(v) => d3.sum(v, (d) => d.revenue),
(d) => d.store_id
));


Insert cell
Insert cell
// Filtrar datos para el año 2022
salesPizza2022 = daily_orders_product.filter(({ order_date }) => new Date(order_date).getFullYear() === 2022);

Insert cell
PizzaTotalOrders = Array.from(d3.rollup(
salesPizza2022,
(v) => d3.sum(v, (d) => d.orders),
(d) => d.name
)).sort(
(a, b) => a[1] - b[1]
);
Insert cell
Insert cell
Insert cell
Insert cell
Plot.plot({
title: "2022 WEEKLY REVENUE",
marginLeft: 50,
y: { label: "Weekly revenue $" },
x: { grid: true, label: 'date' },
marks: [
Plot.dot(sortedDailySales, { x: "0", y: "1", stroke: "#9d5bf3", tip: true })
]
})
Insert cell
Insert cell
Plot.plot({
title: "Profitable stores",
x: {tickRotate:-25},
marginBottom: 50,
marginLeft: 80,
marks: [
Plot.barY(storeTotalSales, {
x: "0",
y: "1",
fill: "#4d2d77",
tip: true,
sort: { x: "y", reverse: true},
}),
Plot.ruleY([0])
]
})
Insert cell
Insert cell
Plot.plot({
width: width,
marginBottom: 25,
color: { legend: true, scheme: "Plasma" },
x: {axis:null},
y: {axis:null},
marks: [
Plot.barX(PizzaTotalOrders,
{ x: "1", fill: "0", tip: true, }
),
]
})
Insert cell
//Your second plot here
Insert cell
//Your third plot here
Insert cell
Insert cell
Insert cell
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