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

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
daily_orders_product
SELECT dop.category, month(dop.order_date) as month, sum(dop.revenue) as revenue
FROM daily_orders_product dop
WHERE year(dop.order_date) = 2021
GROUP BY dop.category, month(dop.order_date)
ORDER BY dop.category, month(dop.order_date) ASC;
Insert cell
category_revenue_data = {
const data = []

let sum = 0
category_revenue.filter(cr => cr.category == "Classic").forEach(cr => {
sum += cr.revenue
data.push({...cr, acc_revenue: sum});
});

category_revenue.filter(cr => cr.category == "Specialty").forEach(cr => {
sum += cr.revenue
data.push({...cr, acc_revenue: sum});
});

category_revenue.filter(cr => cr.category == "Vegetarian").forEach(cr => {
sum += cr.revenue
data.push({...cr, acc_revenue: sum});
});

data.forEach(cr => {
cr.month = months[cr.month-1]
})

return data;
}
Insert cell
category_revenue_data
SELECT crd.month as month, avg(crd.acc_revenue) as avg_revenue
FROM category_revenue_data crd
GROUP BY crd.month;
Insert cell
findStoreById = id => {
return stores.find(s => id == s.id)
}
Insert cell
Insert cell
daily_orders_stores
SELECT dos.store_id as store, month(dos.order_date) as month, sum(dos.revenue) as revenue
FROM daily_orders_stores dos
WHERE year(dos.order_date) = 2020
GROUP BY dos.store_id, month(dos.order_date)
ORDER BY month(dos.order_date) ASC;
Insert cell
store_revenue_by_month = {
const data = [];
store_revenue_by_month_number.forEach(srbm => {
data.push({...srbm, month: months[srbm.month-1]})
})

return data;
}
Insert cell
Insert cell
Insert cell
Plot.plot({
title: "What is the category of pizza with the most revenue in 2021?",
subtitle: "Accumulative revenue for each category along the the year",
marginLeft: 70,
marginRight: 70,
grid: true,
x: {
line: true,
// Setting the order manually by setting the array of months
domain: months
},
marks: [
Plot.ruleY([0]),
Plot.lineY(category_revenue_data, {x: "month", y: "acc_revenue", stroke: "category"}),
Plot.lineY(average_revenue, {x: "month", y: "avg_revenue"}),
Plot.dot(category_revenue_data, { x: "month", y: "acc_revenue", fill: "category", size: 5 }),
Plot.text(category_revenue_data, Plot.selectLast({x: "month", y: "acc_revenue", z: "category", text: "category", textAnchor: "start", dx: 3})),
Plot.text([{ month: average_revenue[average_revenue.length - 1].month, avg_revenue: average_revenue[average_revenue.length - 1].avg_revenue}], { x: "month", y: "avg_revenue", text: d => "Average", textAnchor: "start", dx: 3})
]
})
Insert cell
Plot.plot({
title: "Which are the stores that generates more revenue each month?",
subtitle: "Store revenue of each month of 2020",
width,
height: 930,
marginBottom: 30,
marginLeft: 70,
round: false,
x: {
axis: "top",
line: true,
// Setting the order manually by setting the array of months
domain: months
},
color: {
scheme: "purd",
legend: true,
type: "sqrt",
label: "Revenue"
},
marks: [
Plot.rect(store_revenue_by_month, {
x: "month",
y: "store",
fill: "revenue",
title: "revenue",
tip: true
})
]
})

Insert cell
Insert cell
Insert cell
Insert cell
months = ["Jan", "Feb", "Mar", "Apr", "May", "Jun", "Jul", "Aug", "Sep", "Oct", "Nov", "Dec"]
Insert cell
days_of_week = ["Monday", "Tuesday", "Wednesday", "Thursday", "Friday", "Saturday", "Sunday"]
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