Public
Edited
Sep 20, 2022
3 forks
2 stars
buildTree(fake_assignments, unpack)
unpack = ({
account: new Set(["Snyder, Dillon and Sanchez"]),
engagement: new Set(["Snyder, Dillon and Sanchez - Synergized hybrid strategy"]),
resource: new Set(),
});
buildTree = (assignments, unpack) => d3.flatRollup(
assignments.sort((a, b) => a.start_date - b.start_date),
v => ({
start_date: d3.min(v, d => d.start_date),
end_date: d3.max(v, d => d.end_date),
}),
d => d.engagement.account.name,
d => unpack.account.has(d.engagement.account.name) ? d.engagement.name : "*",
d => unpack.account.has(d.engagement.account.name) && unpack.engagement.has(d.engagement.name) ? d.resource.name : "*",
).map((rollup) => {
const keys = rollup.slice(0, -1);
const data = rollup[rollup.length - 1];
const fKeys = keys.filter(k => k !== '*');
return {
key: keys.join('-'),
keys,
...data,
path: keys.join(' / '),
depth: fKeys.length,
level: Object.keys(unpack)[fKeys.length - 1],
label: fKeys[fKeys.length - 1],
parentLevel: Object.keys(unpack)[fKeys.length - 2],
parentLabel: fKeys[fKeys.length - 2],
lane: keys[0],
}
})
function assignLanesNested(data, {
start = (d, i) => d.start, // given d in data, return the start of the bar as a date or number
end = (d, i) => d.end, // given d in data, return the end of the bar as a date or number
lanes = [(d, i) => 0], // list of functions to apply
xScale = d3.scaleTime(), //padding between rows.
xPadding = 0,
monotonic=false,
} = {}) {
// Assign rows, but grouped by some keys so that bars are arranged in groups belonging to the same lane.
const [lane, ...subLanes] = lanes;
console.log(lane, subLanes);
const groups = d3.flatGroup(data, lane)
const newData = [];
var rowCount = 0;
groups.forEach((g,i) => {
const [laneName, _groupData] = g;
// For each group assign rows.
var groupData = [];
if (subLanes.length) {
groupData = assignLanesNested(
_groupData,
{lanes: subLanes, start, end, xScale, xPadding, monotonic});
} else {
groupData = assignRows(_groupData, {start, end, xScale, xPadding, monotonic})
}
groupData.forEach(d => {
newData.push({
...d,
lane: laneName,
laneNo: i,
rowNo: rowCount + d.rowNo,
});
// Offset future rows by the maximum row number from this gorup.
})
rowCount += d3.max(groupData.map(d => d.rowNo)) + 1;
})
return newData;
}
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.
