Public
Edited
Apr 26, 2023
data = FileAttachment("Money4Nothing@4.csv").csv({ delimeter: ';'})
Plot.plot({
height: 800,
width: 1200,
marginLeft: 100,
marginBottom: 50,
y: { label: 'Money', ticks: 10, nice: true, tickFormat: (d) => `${d/1000}k€`, domain: [-300000, 300000]},
style: {
fontSize: 14,
},
insetLeft: 20,
insetRight: 20,
marks: [
Plot.areaY(data, {x: "date", y: (d) => +d.revenue_m, filter: d => d.revenue_m !== "", fill: "#4D79A7", fillOpacity: 0.2}),
Plot.areaY(data, {x: "date", y: (d) => -d.cost_m, filter: d => d.cost_m !== "", fill: "#F18E2C", fillOpacity: 0.2}),
Plot.areaY(data, {x: "date", y: (d) => +d.profit_m, filter: d => d.profit_m !== "", fill: "#58A14E", fillOpacity: 0.2}),
Plot.lineY(data, {x: "date", y: (d) => +d.revenue_m, filter: d => d.revenue_m !== "", stroke: "#4D79A7"}),
Plot.lineY(data, {x: "date", y: (d) => -d.cost_m, filter: d => d.cost_m !== "", stroke: "#F18E2C"}),
Plot.lineY(data, {x: "date", y: (d) => +d.profit_m, filter: d => d.profit_m !== "", stroke: "#58A14E"}),
Plot.barY(data, {x: "date", y: (d) => +d.revenue, fill: "#4D79A7", insetLeft: 20,insetRight: 20 }),
Plot.text(data, {x: "date", y: (d) => +d.revenue, text: d => d.revenue / 1000, fill: "white", dy: 10, filter: d => d.revenue !== "0" }),
Plot.barY(data, {x: "date", y: (d) => - d.cost, fill: "#F18E2C", insetLeft: 20, insetRight: 20}),
Plot.text(data, {x: "date", y: (d) => -d.cost, text: d => d.cost / 1000, fill: "white", dy: -10, filter: d => d.cost !== "0" }),
Plot.barY(data, {x: "date", y: (d) => +d.profit, fill: (d) => d.profit > 0 ? "#58A14E" : "#E15758", insetLeft: 20, insetRight: 20}),
Plot.text(data, {x: "date", y: (d) => +d.profit, text: d => d.profit/1000, fill: "white", dy: 10, filter: d => d.profit !== "0" }),
Plot.gridY({interval: 50000, stroke: "#fff", strokeOpacity: 1}),
Plot.ruleY([0])
]
})
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.
