Public
Edited
Aug 22, 2023
1 fork
1 star
Insert cell
Insert cell
Insert cell
Insert cell
function groupData(data, total) {
// use scale to get percent values
const percent = d3.scaleLinear().domain([0, total]).range([0, 100]);
// filter out data that has zero values
// also get mapping for next placement
// (save having to format data for d3 stack)
let cumulative = 0;
const _data = data
.map((d) => {
cumulative += d.value;
return {
value: d.value,
// want the cumulative to prior value (start of rect)
cumulative: cumulative - d.value,
label: d.label,
percent: percent(d.value)
};
})
.filter((d) => d.value > 0);
return _data;
}
Insert cell
data = [
{ label: "Belgium", value: 272 },
{ label: "Spain", value: 176 },
{ label: "Germany", value: 159 },
{ label: "Poland", value: 155 },
{ label: "Italy", value: 150 },
{ label: "France", value: 87 },
{ label: "USA", value: 75 },
{ label: "NL", value: 72 },
{ label: "No data", value: 72 }
]
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