Boston-based Senior Front End Developer
Public
Edited
Dec 19, 2023
1 star
window.data = {
bins: [
200.6,
220.34,
240.07999999999998,
259.82,
279.56,
299.3
],
max_value: 299.3,
min_value: 200.6,
percentages: [
0.13043478260869562,
0.13664596273291924,
0.08074534161490682,
0.06832298136645962,
0.06211180124223601
]
};
Plot.plot({
y: { label: "Percentage", tickFormat: ".0%" },
x: { label: "Value" },
marks: [
Plot.axisX(window.data.bins, { tickFormat: d3.format("~s") }),
Plot.rectY(window.data.percentages, {
x1: (y, i) => window.data.bins[i],
x2: (y, i) => window.data.bins[i + 1],
fill: "steelblue",
insetRight: 0.5,
insetLeft: 0.5,
tip: true,
}),
Plot.lineY(window.data.percentages, {
x: (y, i) => window.data.bins[i] + (window.data.bins[i + 1] - window.data.bins[i]) / 2,
curve: "catmull-rom",
stroke: "red",
strokeOpacity: 0.5,
}),
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.
