@mstone6969/graph 0.0.0-stage → 0.2.0

package/dist/charts/structure/UmlLayout.js

@@ -0,0 +1,366 @@
+// src/charts/structure/UmlLayout.ts
+var CROSS_GAP = 28;
+var DUMMY = 6;
+var LANE = 8;
+var LOOP = 22;
+/** Port spacing that keeps diamonds and triangles on one face apart. */
+var PORT = 13;
+var FACE = .84;
+/** Sugiyama layout for boxes of unequal size: cycle breaking, longest-path layers, barycentre ordering, then non-overlapping placement. */
+var UmlLayout = class UmlLayout {
+	#boxes;
+	#edges;
+	#options;
+	#nodes = /* @__PURE__ */ new Map();
+	#layers = [];
+	#chains = [];
+	static place(boxes, edges, options) {
+		return new UmlLayout(boxes, edges, options).#plan();
+	}
+	constructor(boxes, edges, options) {
+		this.#boxes = boxes;
+		this.#edges = edges;
+		this.#options = options;
+	}
+	#plan() {
+		if (!this.#boxes.length) return {
+			boxes: [],
+			routes: [],
+			width: 0,
+			height: 0
+		};
+		this.#assignRanks();
+		this.#insertDummies();
+		this.#orderLayers();
+		this.#placeCross();
+		return this.#route();
+	}
+	#assignRanks() {
+		const { horizontal } = this.#options;
+		for (const box of this.#boxes) this.#nodes.set(box.id, {
+			key: box.id,
+			box,
+			rank: 0,
+			cross: horizontal ? box.height : box.width,
+			along: horizontal ? box.width : box.height,
+			center: 0,
+			order: 0,
+			ups: [],
+			downs: []
+		});
+		const downs = new Map(this.#boxes.map((box) => [box.id, /* @__PURE__ */ new Set()]));
+		const reaches = (from, to) => {
+			const seen = /* @__PURE__ */ new Set([from]), stack = [from];
+			while (stack.length) for (const next of downs.get(stack.pop())) {
+				if (next === to) return true;
+				if (!seen.has(next)) {
+					seen.add(next);
+					stack.push(next);
+				}
+			}
+			return false;
+		};
+		const order = this.#edges.map((edge, index) => ({
+			edge,
+			index
+		})).sort((a, b) => a.edge.priority - b.edge.priority || a.index - b.index);
+		this.#chains = new Array(this.#edges.length);
+		for (const { edge, index } of order) {
+			const self = edge.upper === edge.lower;
+			const flipped = !self && reaches(edge.lower, edge.upper);
+			const [up, down] = flipped ? [edge.lower, edge.upper] : [edge.upper, edge.lower];
+			if (!self) downs.get(up).add(down);
+			this.#chains[index] = {
+				edge: index,
+				nodes: [this.#nodes.get(up), this.#nodes.get(down)],
+				flipped,
+				self
+			};
+		}
+		const incoming = new Map(this.#boxes.map((box) => [box.id, 0]));
+		for (const set of downs.values()) for (const id of set) incoming.set(id, incoming.get(id) + 1);
+		const ready = this.#boxes.filter((box) => !incoming.get(box.id)).map((box) => box.id);
+		while (ready.length) {
+			const id = ready.shift();
+			for (const next of downs.get(id)) {
+				const target = this.#nodes.get(next);
+				target.rank = Math.max(target.rank, this.#nodes.get(id).rank + 1);
+				incoming.set(next, incoming.get(next) - 1);
+				if (!incoming.get(next)) ready.push(next);
+			}
+		}
+		for (const box of this.#boxes) {
+			const ranks = [...downs.get(box.id)].map((id) => this.#nodes.get(id).rank);
+			if (![...downs.values()].some((set) => set.has(box.id)) && ranks.length) this.#nodes.get(box.id).rank = Math.min(...ranks) - 1;
+		}
+	}
+	/** Boxes grow across the flow until every line group on a face has its own port. */
+	#fitPorts() {
+		const { horizontal } = this.#options;
+		for (const node of this.#nodes.values()) {
+			const groups = (first) => {
+				const names = this.#chains.filter((chain) => !chain.self && chain.nodes[first ? 0 : chain.nodes.length - 1] === node).map((chain) => this.#edges[chain.edge].trunk ?? `#${chain.edge}`);
+				return first ? new Set(names).size : names.length;
+			};
+			const cross = (Math.max(groups(true), groups(false)) + 1) * PORT / FACE;
+			if (cross <= node.cross) continue;
+			node.cross = cross;
+			node.box = {
+				...node.box,
+				[horizontal ? "height" : "width"]: cross
+			};
+		}
+	}
+	#insertDummies() {
+		this.#fitPorts();
+		for (const chain of this.#chains) {
+			if (chain.self) continue;
+			const [up, down] = chain.nodes;
+			const nodes = [up];
+			for (let rank = up.rank + 1; rank < down.rank; rank++) {
+				const dummy = {
+					key: `~${chain.edge}.${rank}`,
+					box: null,
+					rank,
+					cross: DUMMY,
+					along: 0,
+					center: 0,
+					order: 0,
+					ups: [],
+					downs: []
+				};
+				this.#nodes.set(dummy.key, dummy);
+				nodes.push(dummy);
+			}
+			nodes.push(down);
+			chain.nodes = nodes;
+			nodes.slice(1).forEach((node, i) => {
+				nodes[i].downs.push(node);
+				node.ups.push(nodes[i]);
+			});
+		}
+		const deepest = Math.max(...[...this.#nodes.values()].map((node) => node.rank));
+		this.#layers = Array.from({ length: deepest + 1 }, () => []);
+		for (const node of this.#nodes.values()) this.#layers[node.rank].push(node);
+		for (const layer of this.#layers) layer.forEach((node, i) => {
+			node.order = i;
+		});
+	}
+	#crossings() {
+		let total = 0;
+		for (const layer of this.#layers) {
+			const ties = layer.flatMap((node) => node.downs.map((down) => [node.order, down.order]));
+			for (let i = 0; i < ties.length; i++) for (let j = i + 1; j < ties.length; j++) if ((ties[i][0] - ties[j][0]) * (ties[i][1] - ties[j][1]) < 0) total++;
+		}
+		return total;
+	}
+	#orderLayers() {
+		let best = this.#crossings(), snapshot = this.#layers.map((layer) => [...layer]);
+		for (let sweep = 0; sweep < 16 && best; sweep++) {
+			const downward = sweep % 2 === 0;
+			const layers = downward ? this.#layers : [...this.#layers].reverse();
+			for (const layer of layers) {
+				const weight = new Map(layer.map((node) => {
+					const near = downward ? node.ups : node.downs;
+					return [node, near.length ? near.reduce((sum, other) => sum + other.order, 0) / near.length : node.order];
+				}));
+				layer.sort((a, b) => weight.get(a) - weight.get(b) || a.order - b.order);
+				layer.forEach((node, i) => {
+					node.order = i;
+				});
+			}
+			const count = this.#crossings();
+			if (count < best) {
+				best = count;
+				snapshot = this.#layers.map((layer) => [...layer]);
+			}
+		}
+		this.#layers = snapshot;
+		for (const layer of this.#layers) layer.forEach((node, i) => {
+			node.order = i;
+		});
+	}
+	/** Least-squares placement: each node aims for its neighbours' mean, and pooled neighbours move as one block, so spacing always holds. */
+	#settle(layer, targets) {
+		let offset = 0;
+		const offsets = layer.map((node, i) => {
+			if (i) offset += (layer[i - 1].cross + node.cross) / 2 + CROSS_GAP;
+			return offset;
+		});
+		const pools = [];
+		targets.forEach((target, i) => {
+			pools.push({
+				total: target - offsets[i],
+				count: 1
+			});
+			while (pools.length > 1 && pools.at(-2).total / pools.at(-2).count > pools.at(-1).total / pools.at(-1).count) {
+				const last = pools.pop();
+				pools.at(-1).total += last.total;
+				pools.at(-1).count += last.count;
+			}
+		});
+		let i = 0;
+		for (const pool of pools) for (let k = 0; k < pool.count; k++, i++) layer[i].center = pool.total / pool.count + offsets[i];
+	}
+	#placeCross() {
+		for (const layer of this.#layers) this.#settle(layer, layer.map(() => 0));
+		const mean = (nodes, fallback) => nodes.length ? nodes.reduce((sum, node) => sum + node.center, 0) / nodes.length : fallback;
+		for (let pass = 0; pass < 24; pass++) {
+			const downward = pass % 2 === 0;
+			for (const layer of downward ? this.#layers : [...this.#layers].reverse()) this.#settle(layer, layer.map((node) => mean(pass > 18 ? [...node.ups, ...node.downs] : downward ? node.ups : node.downs, node.center)));
+		}
+	}
+	/** Every span gets its own lane in the gap between layers, so lines never run over each other or through a box. */
+	#route() {
+		const { horizontal, orthogonal, clearance } = this.#options;
+		const ports = this.#ports();
+		const spans = this.#spans(ports);
+		const left = Math.min(...[...this.#nodes.values()].map((node) => node.center - node.cross / 2));
+		const loops = this.#chains.some((chain) => chain.self) ? 26 : 0;
+		const extent = Math.max(...[...this.#nodes.values()].map((node) => node.center + node.cross / 2)) - left + loops;
+		const thickness = this.#layers.map((layer) => Math.max(0, ...layer.map((node) => node.along)));
+		const lanes = thickness.map((_, rank) => this.#lanes(spans.filter((span) => span.chain.nodes[span.step].rank === rank)));
+		const starts = [];
+		const laneStart = [];
+		let cursor = 0;
+		thickness.forEach((size, rank) => {
+			starts.push(cursor);
+			cursor += size;
+			laneStart.push(cursor + clearance);
+			const used = Math.max(0, ...lanes[rank].values());
+			if (rank < thickness.length - 1) cursor += clearance * 2 + used * LANE;
+		});
+		const point = (cross, along) => horizontal ? {
+			x: along,
+			y: cross - left
+		} : {
+			x: cross - left,
+			y: along
+		};
+		const routes = this.#chains.map((chain) => {
+			if (chain.self) return this.#loop(chain, starts, point);
+			const { nodes } = chain;
+			const out = [];
+			spans.filter((span) => span.chain === chain).forEach((span, s) => {
+				const up = nodes[span.step], down = nodes[span.step + 1];
+				if (s === 0) out.push(point(span.from, starts[up.rank] + up.along));
+				out.push(point(span.from, starts[up.rank] + thickness[up.rank]));
+				if (orthogonal && Math.abs(span.from - span.to) > .5) {
+					const lane = laneStart[up.rank] + (lanes[up.rank].get(span) ?? 0) * LANE;
+					out.push(point(span.from, lane), point(span.to, lane));
+				} else if (!orthogonal && Math.abs(span.from - span.to) > .5) out.push(point(span.from, laneStart[up.rank] - clearance * .3), point(span.to, starts[down.rank] - clearance * .7));
+				out.push(point(span.to, starts[down.rank]));
+				if (down.box === null) out.push(point(span.to, starts[down.rank] + thickness[down.rank]));
+			});
+			const clean = out.filter((at, i) => !i || Math.hypot(at.x - out[i - 1].x, at.y - out[i - 1].y) > .01);
+			return chain.nodes[0].key === this.#edges[chain.edge].upper ? clean : clean.reverse();
+		});
+		const boxes = [...this.#nodes.values()].flatMap((node) => {
+			if (!node.box) return [];
+			const at = point(node.center - node.cross / 2, starts[node.rank]);
+			return [{
+				...node.box,
+				x: at.x,
+				y: at.y
+			}];
+		});
+		const along = cursor;
+		return {
+			boxes,
+			routes,
+			width: horizontal ? along : extent,
+			height: horizontal ? extent : along
+		};
+	}
+	#loop(chain, starts, point) {
+		const node = chain.nodes[0], side = node.center + node.cross / 2, top = starts[node.rank];
+		const a = top + node.along * .35, b = top + node.along * .65;
+		return [
+			point(side, a),
+			point(side + LOOP, a),
+			point(side + LOOP, b),
+			point(side, b)
+		];
+	}
+	/** Exit and entry positions on each face, spread in the order of the far ends so lines leave uncrossed. */
+	#ports() {
+		const ports = /* @__PURE__ */ new Map();
+		const face = (node, label, links) => {
+			const groups = /* @__PURE__ */ new Map();
+			for (const link of links) {
+				const group = link.trunk ?? link.key;
+				const entry = groups.get(group) ?? {
+					toward: [],
+					keys: []
+				};
+				entry.toward.push(link.toward);
+				entry.keys.push(link.key);
+				groups.set(group, entry);
+			}
+			const sorted = [...groups.values()].map((group) => ({
+				...group,
+				at: group.toward.reduce((sum, value) => sum + value, 0) / group.toward.length
+			})).sort((a, b) => a.at - b.at);
+			sorted.forEach((group, i) => {
+				const at = node.box ? node.center + ((i + 1) / (sorted.length + 1) - .5) * node.cross * FACE : node.center;
+				for (const key of group.keys) ports.set(`${label}${key}`, at);
+			});
+		};
+		for (const node of this.#nodes.values()) {
+			const leaving = [];
+			const arriving = [];
+			this.#chains.forEach((chain) => {
+				if (chain.self) return;
+				chain.nodes.forEach((member, i) => {
+					if (member !== node) return;
+					const trunk = this.#edges[chain.edge].trunk;
+					if (i < chain.nodes.length - 1) leaving.push({
+						key: `${chain.edge}.${i}`,
+						toward: chain.nodes[i + 1].center,
+						trunk: i === 0 ? trunk : null
+					});
+					if (i > 0) arriving.push({
+						key: `${chain.edge}.${i - 1}`,
+						toward: chain.nodes[i - 1].center,
+						trunk: null
+					});
+				});
+			});
+			face(node, "out", leaving);
+			face(node, "in", arriving);
+		}
+		return ports;
+	}
+	#spans(ports) {
+		return this.#chains.flatMap((chain) => chain.self ? [] : chain.nodes.slice(1).map((_, step) => ({
+			chain,
+			step,
+			from: ports.get(`out${chain.edge}.${step}`),
+			to: ports.get(`in${chain.edge}.${step}`),
+			trunk: step === 0 ? this.#edges[chain.edge].trunk : null
+		})));
+	}
+	/** Interval colouring of one gap. Spans sharing a trunk take a single lane. */
+	#lanes(spans) {
+		const lanes = /* @__PURE__ */ new Map();
+		const groups = /* @__PURE__ */ new Map();
+		spans.filter((span) => Math.abs(span.from - span.to) > .5).forEach((span, i) => {
+			const key = span.trunk ?? `#${i}`;
+			groups.set(key, [...groups.get(key) ?? [], span]);
+		});
+		const ranges = [...groups.values()].map((members) => ({
+			members,
+			low: Math.min(...members.flatMap((span) => [span.from, span.to])),
+			high: Math.max(...members.flatMap((span) => [span.from, span.to]))
+		})).sort((a, b) => a.low - b.low);
+		const ends = [];
+		for (const range of ranges) {
+			let lane = ends.findIndex((end) => end + 6 < range.low);
+			if (lane < 0) lane = ends.length;
+			ends[lane] = range.high;
+			for (const span of range.members) lanes.set(span, lane);
+		}
+		return lanes;
+	}
+};
+export { UmlLayout };

package/dist/charts/structure/index.js

@@ -0,0 +1,17 @@
+import { DependencyOrdering } from "./DependencyOrdering.js";
+import { DsmColumnLabel, DsmConvention, DsmMark, DsmOrder, MareyAxis, MareySpacing, TournamentElimination, TournamentLayoutKind, TournamentStage, TournamentStyle, UmlDetail, UmlDirection, UmlRelation, UmlRouting } from "./structureEnums.js";
+import { DependencyMatrix } from "./DependencyMatrix.js";
+import { MareyTimetable } from "./MareyTimetable.js";
+import { MareyChart } from "./MareyChart.js";
+import { TournamentDraw } from "./TournamentDraw.js";
+import { TournamentBracket } from "./TournamentBracket.js";
+import { UmlLayout } from "./UmlLayout.js";
+import { UmlClassDiagram } from "./UmlClassDiagram.js";
+// src/charts/structure/index.ts
+var structureCatalog = [
+	TournamentBracket,
+	DependencyMatrix,
+	UmlClassDiagram,
+	MareyChart
+];
+export { DependencyMatrix, DependencyOrdering, DsmColumnLabel, DsmConvention, DsmMark, DsmOrder, MareyAxis, MareyChart, MareySpacing, MareyTimetable, TournamentBracket, TournamentDraw, TournamentElimination, TournamentLayoutKind, TournamentStage, TournamentStyle, UmlClassDiagram, UmlDetail, UmlDirection, UmlLayout, UmlRelation, UmlRouting, structureCatalog };

package/dist/charts/structure/structureEnums.js

@@ -0,0 +1,81 @@
+// src/charts/structure/structureEnums.ts
+var TournamentElimination = /* @__PURE__ */ function(TournamentElimination) {
+	TournamentElimination["Single"] = "single";
+	TournamentElimination["Double"] = "double";
+	return TournamentElimination;
+}({});
+var TournamentLayoutKind = /* @__PURE__ */ function(TournamentLayoutKind) {
+	TournamentLayoutKind["Ladder"] = "ladder";
+	TournamentLayoutKind["Mirrored"] = "mirrored";
+	return TournamentLayoutKind;
+}({});
+var TournamentStyle = /* @__PURE__ */ function(TournamentStyle) {
+	TournamentStyle["Card"] = "card";
+	TournamentStyle["Sheet"] = "sheet";
+	return TournamentStyle;
+}({});
+var TournamentStage = /* @__PURE__ */ function(TournamentStage) {
+	TournamentStage["Winners"] = "winners";
+	TournamentStage["Losers"] = "losers";
+	TournamentStage["Final"] = "final";
+	TournamentStage["ThirdPlace"] = "third-place";
+	return TournamentStage;
+}({});
+var DsmOrder = /* @__PURE__ */ function(DsmOrder) {
+	DsmOrder["Cluster"] = "cluster";
+	DsmOrder["Partition"] = "partition";
+	DsmOrder["Given"] = "given";
+	return DsmOrder;
+}({});
+var DsmConvention = /* @__PURE__ */ function(DsmConvention) {
+	DsmConvention["RowInputs"] = "row-inputs";
+	DsmConvention["ColumnInputs"] = "column-inputs";
+	return DsmConvention;
+}({});
+var DsmMark = /* @__PURE__ */ function(DsmMark) {
+	DsmMark["Cell"] = "cell";
+	DsmMark["Dot"] = "dot";
+	DsmMark["Cross"] = "cross";
+	return DsmMark;
+}({});
+var DsmColumnLabel = /* @__PURE__ */ function(DsmColumnLabel) {
+	DsmColumnLabel["Index"] = "index";
+	DsmColumnLabel["Name"] = "name";
+	return DsmColumnLabel;
+}({});
+var UmlRelation = /* @__PURE__ */ function(UmlRelation) {
+	UmlRelation["Inheritance"] = "inheritance";
+	UmlRelation["Realization"] = "realization";
+	UmlRelation["Composition"] = "composition";
+	UmlRelation["Aggregation"] = "aggregation";
+	UmlRelation["Association"] = "association";
+	UmlRelation["Dependency"] = "dependency";
+	return UmlRelation;
+}({});
+var UmlDirection = /* @__PURE__ */ function(UmlDirection) {
+	UmlDirection["TopDown"] = "top-down";
+	UmlDirection["LeftRight"] = "left-right";
+	return UmlDirection;
+}({});
+var UmlRouting = /* @__PURE__ */ function(UmlRouting) {
+	UmlRouting["Orthogonal"] = "orthogonal";
+	UmlRouting["Direct"] = "direct";
+	return UmlRouting;
+}({});
+var UmlDetail = /* @__PURE__ */ function(UmlDetail) {
+	UmlDetail["Full"] = "full";
+	UmlDetail["Public"] = "public";
+	UmlDetail["Names"] = "names";
+	return UmlDetail;
+}({});
+var MareyAxis = /* @__PURE__ */ function(MareyAxis) {
+	MareyAxis["TimeAcross"] = "time-across";
+	MareyAxis["TimeDown"] = "time-down";
+	return MareyAxis;
+}({});
+var MareySpacing = /* @__PURE__ */ function(MareySpacing) {
+	MareySpacing["Distance"] = "distance";
+	MareySpacing["Even"] = "even";
+	return MareySpacing;
+}({});
+export { DsmColumnLabel, DsmConvention, DsmMark, DsmOrder, MareyAxis, MareySpacing, TournamentElimination, TournamentLayoutKind, TournamentStage, TournamentStyle, UmlDetail, UmlDirection, UmlRelation, UmlRouting };

package/dist/charts/threebars/Area3DChart.js

@@ -0,0 +1,132 @@
+import { ChartFamily, CurveKind, DataShape, Dimension, StackMode } from "../../core/enums.js";
+import { SampleData } from "../../data/SampleData.js";
+import { BOX3D } from "./Cartesian3DChart.js";
+import { Marks3D } from "./Marks3D.js";
+import { Rows3D } from "./Rows3D.js";
+import { Series3DChart, SeriesLayout3D } from "./Series3DChart.js";
+import { mean, stack, stackOffsetExpand, stackOffsetNone, stackOffsetWiggle, stackOrderInsideOut, stackOrderNone } from "d3";
+import { ExtrudeGeometry, Group, Mesh, Shape, Vector2, Vector3 } from "three";
+// src/charts/threebars/Area3DChart.ts
+var THIN = 1e-4;
+/** Solid areas extruded in depth, either one wall per series or stacked in a single slab. */
+var Area3DChart = class Area3DChart extends Series3DChart {
+	static meta = {
+		id: "area-3d",
+		name: "3D area chart",
+		family: ChartFamily.Trend,
+		dimension: Dimension.Three,
+		shape: DataShape.Table,
+		description: "Extrudes the area under each series into a solid wall, separately in depth or stacked to show the total.",
+		tags: [
+			"area",
+			"wall",
+			"stacked",
+			"streamgraph"
+		],
+		sample: (seed) => SampleData.timeSeries(seed, 32, 5),
+		variants: {
+			curve: [
+				CurveKind.Monotone,
+				CurveKind.Linear,
+				CurveKind.Step,
+				CurveKind.Basis
+			],
+			stack: [
+				StackMode.None,
+				StackMode.Stacked,
+				StackMode.Normalized,
+				StackMode.Streamgraph
+			],
+			thickness: [.7, .3],
+			crest: [true, false]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			curve: CurveKind.Monotone,
+			stack: StackMode.None,
+			thickness: .7,
+			crest: true
+		};
+	}
+	build(ctx) {
+		const { stack: mode, y, yTitle } = this.options;
+		const stacked = mode !== StackMode.None;
+		const tracks = this.tracks();
+		const place = this.positional(tracks);
+		const tallestBack = Rows3D.sortBy(tracks, (track) => mean(track.points, (point) => point.value) ?? 0, -1);
+		const lanes = this.lanes(tallestBack.map((track) => track.name), stacked ? SeriesLayout3D.Overlay : SeriesLayout3D.Lanes);
+		const levels = stacked ? this.stacked(tracks) : tracks.map((track) => ({
+			name: track.name,
+			points: track.points.map((point) => [
+				point.order,
+				0,
+				point.value
+			])
+		}));
+		const values = levels.flatMap((level) => level.points.flatMap(([, low, high]) => [low, high]));
+		const height = this.heights(values, [-BOX3D.y, BOX3D.y], !stacked || mode === StackMode.Stacked);
+		const ratio = mode === StackMode.Normalized;
+		this.stage(ctx, {
+			x: place.axis,
+			z: lanes.axis,
+			y: Area3DChart.valueAxis(height, yTitle ?? (ratio ? `share of ${y}` : y), 5, mode === StackMode.Streamgraph ? Math.abs : ratio ? (share) => share * 100 : void 0)
+		}, lanes.depth);
+		const walls = new Group();
+		const floor = height(height.domain()[0]);
+		walls.position.y = floor;
+		ctx.root.add(walls);
+		ctx.reveal((progress) => {
+			walls.scale.y = Math.max(.001, progress);
+		});
+		for (const level of levels) {
+			const slab = {
+				name: level.name,
+				z: lanes.z(level.name),
+				depth: lanes.width * this.options.thickness,
+				low: this.path(level.points.map(([order, low]) => [place.x(order), height(low) - floor])),
+				high: this.path(level.points.map(([order, , high]) => [place.x(order), height(high) - floor]))
+			};
+			this.slab(ctx, walls, slab, tracks.find((track) => track.name === level.name));
+		}
+	}
+	stacked(tracks) {
+		const { stack: mode } = this.options;
+		const orders = [...new Set(tracks.flatMap((track) => track.points.map((point) => point.order)))].sort((a, b) => a - b);
+		const table = orders.map((order) => new Map(tracks.map((track) => [track.name, Math.max(0, track.points.find((point) => point.order === order)?.value ?? 0)])));
+		return stack().keys(tracks.map((track) => track.name)).value((row, key) => row.get(key) ?? 0).offset(mode === StackMode.Normalized ? stackOffsetExpand : mode === StackMode.Streamgraph ? stackOffsetWiggle : stackOffsetNone).order(mode === StackMode.Streamgraph ? stackOrderInsideOut : stackOrderNone)(table).map((band) => ({
+			name: band.key,
+			points: band.map(([low, high], i) => [
+				orders[i],
+				Number.isFinite(low) ? low : 0,
+				Number.isFinite(high) ? high : 0
+			])
+		}));
+	}
+	slab(ctx, parent, { name, low, high, z, depth }, track) {
+		if (high.length < 2) return;
+		const color = ctx.palette.color(name || "Series");
+		const outline = [...high, ...[...low].reverse()].map(([x, y]) => new Vector2(x, y));
+		if (high.every(([, top], i) => top - (low[Math.min(i, low.length - 1)]?.[1] ?? 0) < THIN)) return;
+		const geometry = new ExtrudeGeometry(new Shape(outline), {
+			depth,
+			bevelEnabled: false,
+			steps: 1
+		});
+		geometry.translate(0, 0, z - depth / 2);
+		const mesh = new Mesh(geometry, Marks3D.matte({ color }));
+		mesh.castShadow = mesh.receiveShadow = true;
+		parent.add(mesh);
+		const last = track.points[track.points.length - 1];
+		ctx.pick(mesh, () => ({
+			title: name,
+			color,
+			rows: [[`Last (${last.text})`, +last.value.toFixed(2)]]
+		}));
+		if (!this.options.crest) return;
+		const edge = Marks3D.tube(ctx, high.map(([x, y]) => new Vector3(x, y, z + depth / 2)), .006, ctx.theme.surface);
+		if (edge) parent.add(edge);
+	}
+};
+export { Area3DChart };

package/dist/charts/threebars/Bar3DChart.js

@@ -0,0 +1,56 @@
+import { ChartFamily, DataShape, Dimension, Orientation } from "../../core/enums.js";
+import { SampleData } from "../../data/SampleData.js";
+import { BarBaseline3D, BarField3DChart, BarLayout3D, BarMeasure3D, BarSort3D } from "./BarField3DChart.js";
+import { Marks3D, Prism3D } from "./Marks3D.js";
+// src/charts/threebars/Bar3DChart.ts
+/** Bars standing on a category × series floor: for a value crossed by two dimensions. */
+var Bar3DChart = class extends BarField3DChart {
+	static meta = {
+		id: "bar-3d",
+		name: "3D bar chart",
+		family: ChartFamily.Comparison,
+		dimension: Dimension.Three,
+		shape: DataShape.Table,
+		description: "Places bars on a floor of two categorical dimensions, with height showing the value.",
+		tags: [
+			"column",
+			"skyline",
+			"cluster",
+			"horizontal"
+		],
+		sample: (seed) => SampleData.categories(seed, 7, 5),
+		variants: {
+			shape: [
+				Prism3D.Box,
+				Prism3D.Hexagon,
+				Prism3D.Pyramid
+			],
+			layout: [BarLayout3D.Field, BarLayout3D.Cluster],
+			orientation: [Orientation.Vertical, Orientation.Horizontal],
+			sort: [BarSort3D.Input, BarSort3D.Descending],
+			measure: [
+				BarMeasure3D.Absolute,
+				BarMeasure3D.ShareOfCategory,
+				BarMeasure3D.ShareOfSeries
+			],
+			baseline: [BarBaseline3D.Zero, BarBaseline3D.Mean]
+		},
+		valid: ({ measure, baseline, shape }) => !(baseline === BarBaseline3D.Mean && (measure !== BarMeasure3D.Absolute || shape === Prism3D.Pyramid))
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			shape: Prism3D.Box
+		};
+	}
+	draw(ctx, bars) {
+		const { shape } = this.options;
+		Marks3D.instanced(ctx, Marks3D.prism(shape), bars, {
+			material: Marks3D.matte({ flatShading: Marks3D.facetedPrism(shape) }),
+			place: (dummy, bar, progress) => Marks3D.span(dummy, bar, progress),
+			color: (bar) => this.tint(ctx, bar, bars),
+			tip: (bar) => this.tooltip(bar)
+		});
+	}
+};
+export { Bar3DChart };