Public
Edited
Jan 23, 2024
cat_inp = Inputs.select(["a", "b"], {label: "Select one"})
pivotWider = (data, groupBy, nameFrom, valueFrom) => {
const groupedData = d3.group(data, d => d[groupBy], d => d[nameFrom]);
return Array.from(groupedData, ([group, nameValues]) => {
const result = { [groupBy]: group };
nameValues.forEach((values, name) => {
result[name] = values[0]?.[valueFrom] || 0;
});
return result;
});
}
Type JavaScript, then Shift-Enter. Ctrl-space for more options. Arrow ↑/↓ to switch modes.
rSummarizeLike(dat, "l1", "value1")
dat = generateData()
dataHierarchy = toD3HierarchyFormat(dat, ["l1", "l2"], "value1")
// dataHierarchy = toD3HierarchyFormat(dat)
import {chart as treemap} with {dataHierarchy as data} from "@d3/treemap@164"
treemap
toD3HierarchyFormat = (
data, // array of objects, table-like structure
aggregations=Object.keys(data[0]).slice(0, -1), // defaults to all columns, but the last one
aggValueName=Object.keys(data[0]).slice(-1), // defaults to the last column
aggFunc=d3.sum, // the function to be used for aggregations
name="root" // name of the first level of hierarchy
) => {
const aggregatedData = d3.rollups(
data,
values => aggFunc(values, d => d[aggValueName]),
...aggregations.map(k => (d => d[k]))
);
return transformData(name, aggregatedData)
function transformData(name, children) {
return Array.isArray(children)
? { name, children: children.map(([name, children]) => transformData(name, children)) }
: { name, value: children };
}
}
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.
