@mstone6969/graph 0.0.0-stage → 0.1.0

package/dist/charts/hierarchy/TreeModel.js

@@ -0,0 +1,137 @@
+import { HierarchyMeasure, HierarchySort } from "./hierarchyEnums.js";
+import { ascending, descending, hierarchy, sum } from "d3";
+// src/charts/hierarchy/TreeModel.ts
+var treeFieldDefaults = {
+	name: "name",
+	value: "value",
+	children: "children",
+	id: "id",
+	parent: "parent",
+	sort: HierarchySort.ValueDescending,
+	measure: HierarchyMeasure.Value
+};
+var finite = (value) => {
+	const number = Number(value);
+	return Number.isFinite(number) && number > 0 ? number : 0;
+};
+/** Turns user data of any accepted shape into d3 hierarchies; shared by every 2D and 3D hierarchy chart. */
+var TreeModel = class {
+	fields;
+	datum;
+	/** True when the input held no nodes. */
+	empty;
+	constructor(data, fields) {
+		this.fields = fields;
+		const list = (Array.isArray(data) ? [...data] : data ? [data] : []).filter((item) => item && typeof item === "object");
+		this.empty = !list.length;
+		this.datum = this.ingest(list);
+	}
+	/** Hierarchy sized and sorted by the options. `self` counts internal nodes' own values, for profiler-style data. */
+	root({ folded, limit = this.fields.maxDepth ?? Infinity, self = false } = {}) {
+		const root = hierarchy(this.datum, (datum) => datum.level < limit && !folded?.has(datum.id) ? datum.children : void 0);
+		return this.order(this.size(root, self));
+	}
+	/** Same nodes with every leaf hanging directly from the root. */
+	flat(root) {
+		const flat = hierarchy({
+			...root.data,
+			children: root.leaves().map((leaf) => ({
+				...leaf.data,
+				children: void 0
+			}))
+		});
+		return this.order(this.size(flat, false));
+	}
+	/** Writes `value` on each node, falling back to leaf counts when every value is zero or missing. */
+	size(root, self) {
+		const count = this.fields.measure === HierarchyMeasure.LeafCount || !this.datum.total;
+		return root.eachAfter((node) => {
+			const inner = node.children ? sum(node.children, (child) => child.value) + (self && !count ? node.data.own : 0) : 0;
+			node.value = node.children ? inner : count ? node.data.leaves : node.data.total;
+		});
+	}
+	/** Every source node as rows, regardless of depth limits or folding. */
+	table() {
+		return {
+			columns: [
+				"name",
+				"path",
+				"depth",
+				"value"
+			],
+			rows: this.root({ limit: Infinity }).descendants().map((node) => [
+				node.data.name,
+				node.data.id,
+				node.depth,
+				node.value ?? 0
+			])
+		};
+	}
+	order(root) {
+		const { sort } = this.fields;
+		if (sort === HierarchySort.ValueDescending) root.sort((a, b) => descending(a.value, b.value));
+		if (sort === HierarchySort.ValueAscending) root.sort((a, b) => ascending(a.value, b.value));
+		if (sort === HierarchySort.Name) root.sort((a, b) => ascending(a.data.name, b.data.name));
+		return root;
+	}
+	ingest(list) {
+		const { name = "name", value = "value", children = "children" } = this.fields;
+		const nodes = this.isFlat(list) ? this.stratify(list) : list;
+		const top = nodes.length === 1 ? nodes[0] : {
+			[name]: "All",
+			[children]: nodes
+		};
+		const visit = (raw, id, level, branch, line) => {
+			const label = String(raw[name] ?? "");
+			const kids = Array.isArray(raw[children]) ? raw[children].filter((kid) => kid && typeof kid === "object" && !line.has(kid)) : [];
+			const seen = /* @__PURE__ */ new Map();
+			const nested = kids.map((kid) => {
+				const key = String(kid[name] ?? "");
+				const repeat = seen.get(key) ?? 0;
+				seen.set(key, repeat + 1);
+				return visit(kid, `${id}/${key}${repeat ? `~${repeat}` : ""}`, level + 1, level === 0 ? key : branch, new Set(line).add(kid));
+			});
+			const own = finite(raw[value]);
+			return {
+				id,
+				name: label,
+				branch,
+				level,
+				own,
+				source: raw,
+				total: nested.length ? sum(nested, (kid) => kid.total) : own,
+				leaves: nested.length ? sum(nested, (kid) => kid.leaves) : 1,
+				children: nested.length ? nested : void 0
+			};
+		};
+		return visit(top, "", 0, String(top[name] ?? ""), /* @__PURE__ */ new Set([top]));
+	}
+	isFlat(list) {
+		const { children = "children", parent = "parent" } = this.fields;
+		return list.some((row) => parent in row) && !list.some((row) => Array.isArray(row[children]));
+	}
+	/** Links rows by id. A row whose parent is missing, or that would close a cycle, becomes a root; repeated ids keep the first row. */
+	stratify(rows) {
+		const { id = "id", parent = "parent", children = "children" } = this.fields;
+		const byId = /* @__PURE__ */ new Map();
+		for (const row of rows) if (!byId.has(String(row[id]))) byId.set(String(row[id]), {
+			...row,
+			[children]: []
+		});
+		const above = /* @__PURE__ */ new Map();
+		const roots = [];
+		for (const node of byId.values()) {
+			let up = byId.get(String(node[parent]));
+			for (let at = up; at; at = above.get(at)) if (at === node) {
+				up = void 0;
+				break;
+			}
+			if (up) {
+				above.set(node, up);
+				up[children].push(node);
+			} else roots.push(node);
+		}
+		return roots;
+	}
+};
+export { TreeModel, treeFieldDefaults };

package/dist/charts/hierarchy/TreeNodeLinkChart.js

@@ -0,0 +1,50 @@
+import { HierarchyChart } from "./HierarchyChart.js";
+import { TreeNodeMark } from "./hierarchyEnums.js";
+import { max } from "d3";
+// src/charts/hierarchy/TreeNodeLinkChart.ts
+var DOT = 4;
+var LARGEST = 13;
+/** Trees drawn as nodes and edges. Subclasses position spots; this paints edges, dots and labels with entrance from the parent. */
+var TreeNodeLinkChart = class extends HierarchyChart {
+	/** Dot radius by mark kind. `Area` keeps area proportional to value, with the smallest still legible. */
+	dotRadius(root, mark = TreeNodeMark.Dot) {
+		if (mark === TreeNodeMark.None) return () => 0;
+		if (mark === TreeNodeMark.Dot) return () => DOT;
+		const peak = max(root.children ?? [root], (node) => node.value) || 1;
+		return (node) => Math.min(LARGEST, Math.max(3, LARGEST * Math.sqrt((node.value ?? 0) / peak)));
+	}
+	paintTree(ctx, spots, edge, act) {
+		const byId = new Map(spots.map((spot) => [spot.node.data.id, spot]));
+		const parent = (spot) => byId.get(spot.node.parent?.data.id ?? "") ?? spot;
+		const lines = ctx.marks("links", "path", spots.filter((spot) => spot.node.parent), (spot) => spot.node.data.id).attr("fill", "none").attr("stroke", (spot) => this.style.branch(spot.node)).attr("stroke-opacity", .5).attr("stroke-width", spots.length > 160 ? 1 : 2).attr("stroke-linecap", "round");
+		ctx.set(lines, { d: (spot) => edge(parent(spot), spot) }, { d: (spot) => edge(parent(spot), parent(spot)) }, this.stagger(lines, 3));
+		this.interact(ctx, lines, (spot) => spot.node, act);
+		const dots = ctx.marks("dots", "circle", spots.filter((spot) => spot.r > 0), (spot) => spot.node.data.id).attr("fill", (spot) => this.style.branch(spot.node)).attr("stroke", this.theme.surface).attr("stroke-width", 2);
+		ctx.set(dots, {
+			cx: (spot) => spot.x,
+			cy: (spot) => spot.y,
+			r: (spot) => spot.r
+		}, {
+			cx: (spot) => parent(spot).x,
+			cy: (spot) => parent(spot).y,
+			r: 0
+		}, this.stagger(dots, 3));
+		this.interact(ctx, dots, (spot) => spot.node, act);
+		const badges = spots.filter((spot) => spot.badge).map((spot) => ({
+			key: `${spot.node.data.id}/badge`,
+			text: spot.badge,
+			x: spot.x,
+			y: spot.y,
+			anchor: "middle",
+			dy: ".35em",
+			size: 9,
+			weight: 600,
+			fill: this.style.ink(this.style.branch(spot.node))
+		}));
+		this.labels(ctx, "names", [...spots.filter((spot) => spot.label).map((spot) => ({
+			key: spot.node.data.id,
+			...spot.label
+		})), ...badges]);
+	}
+};
+export { TreeNodeLinkChart };

package/dist/charts/hierarchy/TreeSamples.js

@@ -0,0 +1,51 @@
+import { SampleData } from "../../data/SampleData.js";
+// src/charts/hierarchy/TreeSamples.ts
+/** Reshapes of `SampleData.tree` that real-world hierarchies have and the balanced sample lacks. */
+var TreeSamples = class TreeSamples {
+	/** First tree from `seed` on with at least three top-level branches, since two branches make weak examples. */
+	static broad(seed, depth = 3, breadth = 4) {
+		for (let next = seed; next < seed + 40; next++) {
+			const tree = SampleData.tree(next, depth, breadth);
+			if ((tree.children?.length ?? 0) >= 3) return tree;
+		}
+		return SampleData.tree(seed, depth, breadth);
+	}
+	/** Uneven depth: every third internal child collapses into one leaf holding its subtree's total. */
+	static uneven(seed, depth = 3, breadth = 4) {
+		const total = (node) => node.children?.reduce((all, kid) => all + total(kid), 0) ?? node.value ?? 0;
+		const trim = (node, level) => ({
+			...node,
+			children: node.children?.map((kid, i) => kid.children && level > 0 && (i + level) % 3 === 0 ? {
+				name: kid.name,
+				value: total(kid)
+			} : trim(kid, level + 1))
+		});
+		return trim(TreeSamples.broad(seed, depth, breadth), 0);
+	}
+	/** Adds an evolutionary-distance `length` to each branch, derived from the sample's values. */
+	static branchLengths(seed) {
+		let step = 0;
+		const grow = (node) => {
+			step += 1;
+			return {
+				...node,
+				length: .4 + ((node.value ?? 37) * 7 + step * 13) % 29 / 16,
+				children: node.children?.map(grow)
+			};
+		};
+		return grow(TreeSamples.uneven(seed, 3, 3));
+	}
+	/** Profiler shape: deep call stacks whose inner frames also carry self time. */
+	static callStacks(seed) {
+		const stamp = (node, level) => {
+			const children = node.children?.map((kid) => stamp(kid, level + 1));
+			return {
+				...node,
+				children,
+				value: children ? (level * 17 + children.length * 9) % 23 : node.value
+			};
+		};
+		return stamp(TreeSamples.uneven(seed, 5, 3), 0);
+	}
+};
+export { TreeSamples };

package/dist/charts/hierarchy/TreeStyle.js

@@ -0,0 +1,91 @@
+import { HierarchyColor } from "./hierarchyEnums.js";
+import { color, format, interpolateRgb, max } from "d3";
+// src/charts/hierarchy/TreeStyle.ts
+var CHAR = 6.2 / 11;
+var hex = (value) => color(value)?.formatHex() ?? value;
+/** Colour, tooltip and text-fitting rules shared by every hierarchy chart, in 2D and 3D. */
+var TreeStyle = class TreeStyle {
+	palette;
+	theme;
+	mode;
+	root;
+	number;
+	constructor(palette, theme, mode = HierarchyColor.Branch, root, valueFormat) {
+		this.palette = palette;
+		this.theme = theme;
+		this.mode = mode;
+		this.root = root;
+		this.number = valueFormat ?? format(",.4~g");
+		for (const branch of root.data.children ?? []) palette.color(branch.name);
+	}
+	/** Identity colour of the node's top-level branch; the root stays neutral. */
+	branch(node) {
+		return node.depth === 0 ? this.theme.inkMuted : hex(this.palette.color(node.data.branch));
+	}
+	/** Mix a colour towards the surface, keeping it hex so `inkOn` can read it. */
+	tint(color, amount) {
+		return hex(interpolateRgb(color, this.theme.surface)(amount));
+	}
+	/** Filled-mark colour. Branch mode keeps hue for identity and lightens small siblings and deep levels. */
+	fill(node) {
+		if (node.depth === 0) return this.tint(this.theme.axis, .35);
+		if (this.mode === HierarchyColor.Depth) return hex(this.palette.sequential(.2 + .7 * (node.depth - 1) / Math.max(1, this.root.height - 1)));
+		if (this.mode === HierarchyColor.Value) return hex(this.palette.sequential(.15 + .8 * ((node.value ?? 0) / (max(node.parent.children, (peer) => peer.value) || 1))));
+		const peak = max(node.parent.children, (peer) => peer.value) || 1;
+		const small = node.depth > 1 ? .34 * (1 - (node.value ?? 0) / peak) : 0;
+		return this.tint(this.branch(node), Math.min(.55, small + .1 * Math.max(0, node.depth - 1)));
+	}
+	ink(fill) {
+		return this.palette.inkOn(hex(fill));
+	}
+	format(value) {
+		return this.number(value);
+	}
+	tooltip(node) {
+		const trail = node.ancestors().reverse().slice(node.depth > 3 ? -3 : 1).map((step) => step.data.name);
+		const total = this.root.value || 1;
+		const rows = [["Value", this.number(node.value ?? 0)], ["Share of total", format(".1%")((node.value ?? 0) / total)]];
+		if (node.parent && node.depth > 1) rows.push(["Share of parent", format(".1%")((node.value ?? 0) / (node.parent.value || 1))]);
+		if (node.data.children) rows.push(["Leaves", node.data.leaves]);
+		return {
+			title: trail.join(" › ") || node.data.name,
+			color: this.fill(node),
+			rows
+		};
+	}
+	/** Legend: at most eight identities, with anything past them folded into one "Other" entry. */
+	static legend(items, other) {
+		return items.length > 8 ? [...items.slice(0, 8), {
+			key: "Other",
+			color: other
+		}] : items;
+	}
+	/** Keeps labels in order, dropping any that would overlap one already kept. */
+	static declutter(items) {
+		const kept = [];
+		for (const item of items) {
+			if (!item.label) continue;
+			const { text, x, y, anchor, size = 11 } = item.label;
+			const wide = TreeStyle.width(text, size);
+			const box = [
+				anchor === "end" ? x - wide : x,
+				y - size / 2 - 1,
+				anchor === "end" ? x : x + wide,
+				y + size / 2 + 1
+			];
+			if (kept.some((b) => box[0] < b[2] && b[0] < box[2] && box[1] < b[3] && b[1] < box[3])) item.label = void 0;
+			else kept.push(box);
+		}
+	}
+	/** Width of a label at `size` px, by estimate. */
+	static width(text, size = 11) {
+		return text.length * size * CHAR;
+	}
+	/** Text cut to `room` px with an ellipsis, or empty when not even three characters fit. */
+	static fit(text, room, size = 11) {
+		if (TreeStyle.width(text, size) <= room) return text;
+		const keep = Math.floor(room / (size * CHAR)) - 1;
+		return keep >= 2 ? `${text.slice(0, keep).trimEnd()}…` : "";
+	}
+};
+export { TreeStyle };

package/dist/charts/hierarchy/TreemapChart.js

@@ -0,0 +1,104 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { HierarchyChart } from "./HierarchyChart.js";
+import { HierarchyMeasure, HierarchySort, TreemapGrouping, TreemapTile, countsKeepDefaultSort } from "./hierarchyEnums.js";
+import { treemapTiling } from "./TreemapTiling.js";
+import { TreeSamples } from "./TreeSamples.js";
+import { TreeStyle } from "./TreeStyle.js";
+import { treemap } from "d3";
+// src/charts/hierarchy/TreemapChart.ts
+/**
+* Part-to-whole across many items, with every d3 tiling method.
+* `Resquarify` fixes the arrangement from leaf counts, so cells hold their place as values change.
+*/
+var TreemapChart = class extends HierarchyChart {
+	static meta = {
+		id: "treemap",
+		name: "Treemap",
+		family: ChartFamily.Hierarchy,
+		dimension: Dimension.Two,
+		shape: DataShape.Hierarchy,
+		description: "Fills a rectangle with cells whose area shows each leaf of a hierarchy, for reading part-to-whole across many items.",
+		tags: [
+			"squarified",
+			"slice and dice",
+			"binary",
+			"part to whole",
+			"space filling"
+		],
+		sample: (seed) => TreeSamples.broad(seed, 3, 4),
+		variants: {
+			tile: Object.values(TreemapTile),
+			grouping: Object.values(TreemapGrouping),
+			sort: [
+				HierarchySort.ValueDescending,
+				HierarchySort.ValueAscending,
+				HierarchySort.Input
+			],
+			measure: [HierarchyMeasure.Value, HierarchyMeasure.LeafCount],
+			aspect: [1.618, 2.6]
+		},
+		valid: ({ tile, measure, aspect, grouping, sort }) => countsKeepDefaultSort({
+			measure,
+			sort
+		}) && (aspect === 1.618 || tile === TreemapTile.Squarify && grouping !== TreemapGrouping.TopLevel) && !(tile === TreemapTile.Resquarify && measure === HierarchyMeasure.LeafCount) && !(grouping === TreemapGrouping.TopLevel && (sort === HierarchySort.Input || tile === TreemapTile.Binary)) && !(tile === TreemapTile.SliceDice && grouping !== TreemapGrouping.Nested) && !(tile === TreemapTile.Resquarify && grouping === TreemapGrouping.TopLevel)
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			tile: TreemapTile.Squarify,
+			grouping: TreemapGrouping.Nested,
+			aspect: 1.618
+		};
+	}
+	drawTree(ctx) {
+		const { tile, grouping, aspect } = this.options;
+		const full = this.tree({ limit: grouping === TreemapGrouping.TopLevel ? 1 : void 0 });
+		const root = grouping === TreemapGrouping.Flat ? this.model.flat(full) : full;
+		const layout = treemap().size([ctx.plot.width, ctx.plot.height]).round(true).tile(treemapTiling(tile, aspect)).paddingInner((node) => node.depth === 0 ? 5 : node.depth === 1 ? 3 : 2);
+		if (tile === TreemapTile.Resquarify) {
+			root.eachAfter((node) => {
+				node.value = node.data.leaves;
+			});
+			layout(root);
+			this.model.size(root, false);
+		}
+		const cells = layout(root).leaves();
+		const rects = ctx.marks("cells", "rect", cells, (node) => node.data.id).attr("fill", (node) => this.style.fill(node)).attr("rx", (node) => Math.min(3, (node.x1 - node.x0) / 2, (node.y1 - node.y0) / 2));
+		ctx.set(rects, {
+			x: (node) => node.x0,
+			y: (node) => node.y0,
+			width: (node) => node.x1 - node.x0,
+			height: (node) => node.y1 - node.y0
+		}, {
+			x: (node) => (node.x0 + node.x1) / 2,
+			y: (node) => (node.y0 + node.y1) / 2,
+			width: 0,
+			height: 0
+		}, this.stagger(rects, 4));
+		this.interact(ctx, rects, (node) => node);
+		this.labels(ctx, "names", cells.flatMap((node) => this.cellLabels(node)));
+	}
+	cellLabels(node) {
+		const width = node.x1 - node.x0, height = node.y1 - node.y0;
+		if (height < 18) return [];
+		const fill = this.style.ink(this.style.fill(node));
+		const name = TreeStyle.fit(node.data.name, width - 10);
+		const value = height >= 34 ? TreeStyle.fit(this.style.format(node.value ?? 0), width - 10, 10) : "";
+		return [{
+			key: `${node.data.id}/name`,
+			text: name,
+			x: node.x0 + 5,
+			y: node.y0 + 14,
+			fill,
+			weight: 500
+		}, {
+			key: `${node.data.id}/value`,
+			text: name ? value : "",
+			x: node.x0 + 5,
+			y: node.y0 + 27,
+			fill,
+			size: 10
+		}];
+	}
+};
+export { TreemapChart };

package/dist/charts/hierarchy/TreemapSkyline3D.js

@@ -0,0 +1,98 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { Hierarchy3DChart } from "./Hierarchy3DChart.js";
+import { HierarchyMeasure, SkylineHeight, TreemapTile } from "./hierarchyEnums.js";
+import { treemapTiling } from "./TreemapTiling.js";
+import { TreeSamples } from "./TreeSamples.js";
+import { max, treemap } from "d3";
+import { BoxGeometry, InstancedMesh, Mesh, MeshStandardMaterial, Object3D, PlaneGeometry } from "three";
+// src/charts/hierarchy/TreemapSkyline3D.ts
+var FLOOR = -.7;
+var STEP = .05;
+var TOP = 1.3;
+/** Treemap extruded into a city: footprint and height can carry two measures of the same items. */
+var TreemapSkyline3D = class extends Hierarchy3DChart {
+	static meta = {
+		id: "treemap-skyline-3d",
+		name: "3D treemap skyline",
+		family: ChartFamily.Hierarchy,
+		dimension: Dimension.Three,
+		shape: DataShape.Hierarchy,
+		description: "Extrudes treemap cells into a city, so footprint and height can carry different views of the same items.",
+		tags: [
+			"city",
+			"extruded treemap",
+			"skyline",
+			"software city"
+		],
+		sample: (seed) => TreeSamples.broad(seed, 3, 4),
+		variants: {
+			tile: [
+				TreemapTile.Squarify,
+				TreemapTile.Binary,
+				TreemapTile.SliceDice
+			],
+			heightBy: Object.values(SkylineHeight),
+			terraces: [true, false],
+			measure: [HierarchyMeasure.Value, HierarchyMeasure.LeafCount]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			tile: TreemapTile.Squarify,
+			heightBy: SkylineHeight.Value,
+			terraces: true
+		};
+	}
+	buildTree(ctx) {
+		const { tile, heightBy, terraces } = this.options;
+		const gap = .012;
+		const root = treemap().size([2, 2]).tile(treemapTiling(tile)).paddingInner(gap).paddingOuter((node) => terraces && node.depth > 0 ? gap * 2 : 0)(this.tree());
+		const cells = root.leaves();
+		const groups = terraces ? root.descendants().filter((node) => node.depth > 0 && node.children) : [];
+		const peak = max(cells, (cell) => cell.data.total) || 1;
+		const rise = (cell) => {
+			const share = cell.data.total / peak;
+			if (heightBy === SkylineHeight.Depth) return .06 + .5 * share * (cell.depth / Math.max(1, root.height));
+			return Math.max(.02, TOP * (heightBy === SkylineHeight.Sqrt ? Math.sqrt(share) : share));
+		};
+		const base = (node) => FLOOR + (terraces ? (node.depth - 1) * STEP : 0);
+		const floor = new Mesh(new PlaneGeometry(2.3, 2.3), new MeshStandardMaterial({ color: ctx.theme.grid }));
+		floor.rotation.x = -Math.PI / 2;
+		floor.position.y = -.701;
+		floor.receiveShadow = true;
+		ctx.root.add(floor);
+		const dummy = new Object3D();
+		const box = new BoxGeometry(1, 1, 1);
+		const plinths = groups.length ? new InstancedMesh(box.clone(), new MeshStandardMaterial({ roughness: .8 }), groups.length) : null;
+		groups.forEach((group, i) => {
+			dummy.position.set((group.x0 + group.x1) / 2 - 1, base(group) + STEP / 2, (group.y0 + group.y1) / 2 - 1);
+			dummy.scale.set(group.x1 - group.x0, STEP, group.y1 - group.y0);
+			dummy.updateMatrix();
+			plinths.setMatrixAt(i, dummy.matrix);
+			plinths.setColorAt(i, ctx.color(this.style.tint(this.style.branch(group), .72 - .2 * (group.depth - 1))));
+		});
+		if (plinths) {
+			plinths.receiveShadow = true;
+			ctx.root.add(plinths);
+			ctx.pick(plinths, (i) => this.style.tooltip(groups[i]));
+		}
+		const towers = new InstancedMesh(box, new MeshStandardMaterial({ roughness: .55 }), cells.length);
+		towers.castShadow = towers.receiveShadow = true;
+		cells.forEach((cell, i) => towers.setColorAt(i, ctx.color(this.style.fill(cell))));
+		ctx.reveal((progress) => {
+			cells.forEach((cell, i) => {
+				const tall = Math.max(.001, rise(cell) * progress);
+				const floorY = base(cell) + (terraces ? STEP : 0);
+				dummy.position.set((cell.x0 + cell.x1) / 2 - 1, floorY + tall / 2, (cell.y0 + cell.y1) / 2 - 1);
+				dummy.scale.set(cell.x1 - cell.x0, tall, cell.y1 - cell.y0);
+				dummy.updateMatrix();
+				towers.setMatrixAt(i, dummy.matrix);
+			});
+			towers.instanceMatrix.needsUpdate = true;
+		});
+		ctx.root.add(towers);
+		ctx.pick(towers, (i) => this.style.tooltip(cells[i]));
+	}
+};
+export { TreemapSkyline3D };

package/dist/charts/hierarchy/TreemapTiling.js

@@ -0,0 +1,16 @@
+import { TreemapTile } from "./hierarchyEnums.js";
+import { treemapBinary, treemapDice, treemapResquarify, treemapSlice, treemapSliceDice, treemapSquarify } from "d3";
+// src/charts/hierarchy/TreemapTiling.ts
+var GOLDEN = (1 + Math.sqrt(5)) / 2;
+/** Maps the tiling enum to d3's tiling function; `aspect` is the target width to height of squarified cells. */
+function treemapTiling(tile, aspect = GOLDEN) {
+	if (tile === TreemapTile.Squarify) return treemapSquarify.ratio(aspect);
+	if (tile === TreemapTile.Resquarify) return treemapResquarify.ratio(aspect);
+	return {
+		[TreemapTile.Binary]: treemapBinary,
+		[TreemapTile.Dice]: treemapDice,
+		[TreemapTile.Slice]: treemapSlice,
+		[TreemapTile.SliceDice]: treemapSliceDice
+	}[tile];
+}
+export { treemapTiling };

package/dist/charts/hierarchy/ZoomAdjacencyChart.js

@@ -0,0 +1,18 @@
+import { AdjacencyChart } from "./AdjacencyChart.js";
+import { ZoomStart } from "./hierarchyEnums.js";
+// src/charts/hierarchy/ZoomAdjacencyChart.ts
+/** Adjacency chart with a focus node: clicking a block zooms to it, clicking the focus zooms back out. */
+var ZoomAdjacencyChart = class extends AdjacencyChart {
+	focusId = null;
+	focusOf(root) {
+		const chosen = this.focusId === null ? void 0 : root.find((node) => node.data.id === this.focusId);
+		if (chosen) return chosen;
+		return this.options.zoomStart === ZoomStart.LargestBranch ? root.children?.reduce((top, node) => (node.value ?? 0) > (top.value ?? 0) ? node : top) ?? root : root;
+	}
+	zoom = (node) => {
+		const current = this.focusId;
+		this.focusId = node.data.id === current && node.parent ? node.parent.data.id : node.data.id;
+		this.render();
+	};
+};
+export { ZoomAdjacencyChart };