@mstone6969/graph 0.0.0-stage → 0.2.0

package/dist/charts/threenetwork/ForceLayout3D.js

@@ -0,0 +1,103 @@
+import { Vector3 } from "three";
+// src/charts/threenetwork/ForceLayout3D.ts
+var Octant = class {
+	origin;
+	half;
+	mass = 0;
+	center = new Vector3();
+	kids = null;
+	point = -1;
+	constructor(origin, half) {
+		this.origin = origin;
+		this.half = half;
+	}
+};
+var THETA = .81;
+var MAX_DEPTH = 14;
+/** Deterministic 3D force layout: Barnes-Hut repulsion, spring links, cooled to rest. d3-force is 2D only. */
+var ForceLayout3D = class {
+	/** Evenly spread directions on the unit sphere. */
+	static sphere(index, count) {
+		const y = count > 1 ? 1 - 2 * (index + .5) / count : 0, r = Math.sqrt(1 - y * y), angle = index * Math.PI * (3 - Math.sqrt(5));
+		return new Vector3(r * Math.cos(angle), y, r * Math.sin(angle));
+	}
+	static run({ count, links, anchor, shell, squash = 1, ticks = Math.round(Math.max(120, 320 - count / 8)) }) {
+		const points = Array.from({ length: count }, (_, i) => this.sphere(i, count).multiplyScalar(.3 + .7 * (i * .618 % 1)));
+		const moves = points.map(() => new Vector3());
+		const degree = new Float32Array(count);
+		for (const [a, b] of links) {
+			degree[a]++;
+			degree[b]++;
+		}
+		const repulsion = .9 / Math.max(count, 1) ** .75, length = 1.6 / Math.cbrt(Math.max(count, 2)), scratch = new Vector3();
+		for (let tick = 0; tick < ticks; tick++) {
+			const alpha = 1 - tick / ticks;
+			const tree = this.octree(points);
+			points.forEach((point, i) => this.repel(tree, i, point, moves[i], repulsion * alpha));
+			for (const [a, b] of links) {
+				scratch.subVectors(points[b], points[a]);
+				const pull = .08 * alpha * (scratch.length() - length) / Math.max(scratch.length(), .001);
+				moves[a].addScaledVector(scratch, pull / Math.max(degree[a] ** .5, 1));
+				moves[b].addScaledVector(scratch, -pull / Math.max(degree[b] ** .5, 1));
+			}
+			points.forEach((point, i) => {
+				const home = anchor?.(i);
+				const move = moves[i].addScaledVector(point, -.02 * alpha);
+				if (home) move.addScaledVector(scratch.subVectors(home, point), .09 * alpha);
+				point.add(move.clampLength(0, .2));
+				point.y *= squash;
+				if (shell) point.setLength(point.length() + (shell(i) - point.length()) * .35);
+				move.multiplyScalar(.55);
+			});
+		}
+		return this.fit(points);
+	}
+	/** Centres the layout and scales it uniformly into the unit sphere. */
+	static fit(points, radius = 1) {
+		const center = points.reduce((sum, point) => sum.add(point), new Vector3()).divideScalar(points.length || 1);
+		const reach = Math.max(.001, ...points.map((point) => point.distanceTo(center)));
+		return points.map((point) => point.sub(center).multiplyScalar(radius / reach));
+	}
+	static octree(points) {
+		const half = Math.max(1, ...points.map((p) => Math.max(Math.abs(p.x), Math.abs(p.y), Math.abs(p.z)))) * 1.01;
+		const root = new Octant(new Vector3(), half);
+		points.forEach((point, i) => this.insert(root, points, i, point, 0));
+		return root;
+	}
+	static insert(cell, points, index, point, depth) {
+		cell.center.multiplyScalar(cell.mass).add(point).divideScalar(cell.mass + 1);
+		cell.mass++;
+		if (cell.mass === 1 || depth >= MAX_DEPTH) {
+			cell.point = index;
+			return;
+		}
+		const kids = cell.kids ??= new Array(8);
+		if (cell.point >= 0) {
+			const moved = cell.point;
+			cell.point = -1;
+			this.descend(cell, kids, points, moved, points[moved], depth);
+		}
+		this.descend(cell, kids, points, index, point, depth);
+	}
+	static descend(cell, kids, points, index, point, depth) {
+		const { origin, half } = cell;
+		const slot = (point.x > origin.x ? 1 : 0) | (point.y > origin.y ? 2 : 0) | (point.z > origin.z ? 4 : 0);
+		const step = half / 2;
+		const kid = kids[slot] ??= new Octant(new Vector3(origin.x + (slot & 1 ? step : -step), origin.y + (slot & 2 ? step : -step), origin.z + (slot & 4 ? step : -step)), step);
+		this.insert(kid, points, index, point, depth + 1);
+	}
+	static repel(cell, index, point, move, strength) {
+		if (!cell.mass || cell.point === index && cell.mass === 1) return;
+		const dx = point.x - cell.center.x, dy = point.y - cell.center.y, dz = point.z - cell.center.z;
+		const d2 = dx * dx + dy * dy + dz * dz + 1e-4;
+		if (!cell.kids || (cell.half * 2) ** 2 < THETA * THETA * d2) {
+			const force = strength * cell.mass / d2 / Math.sqrt(d2);
+			move.x += dx * force * .06;
+			move.y += dy * force * .06;
+			move.z += dz * force * .06;
+			return;
+		}
+		for (const kid of cell.kids) if (kid) this.repel(kid, index, point, move, strength);
+	}
+};
+export { ForceLayout3D };

package/dist/charts/threenetwork/Gantt3DChart.js

@@ -0,0 +1,183 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SampleData } from "../../data/SampleData.js";
+import { LabelSpacer3D } from "./LabelSpacer3D.js";
+import { NetworkMarks3D } from "./NetworkMarks3D.js";
+import { Path3D } from "./Path3D.js";
+import { DAY, Temporal3DBase } from "./Temporal3DBase.js";
+import { scaleBand, scaleTime } from "d3";
+import { BoxGeometry, Vector3 } from "three";
+// src/charts/threenetwork/Gantt3DChart.ts
+/** How tasks share the plan. */
+var GanttStack3D = /* @__PURE__ */ function(GanttStack3D) {
+	GanttStack3D["Rows"] = "rows";
+	GanttStack3D["Lanes"] = "lanes";
+	GanttStack3D["Decks"] = "decks";
+	return GanttStack3D;
+}({});
+var GanttOrder3D = /* @__PURE__ */ function(GanttOrder3D) {
+	GanttOrder3D["Start"] = "start";
+	GanttOrder3D["Group"] = "group";
+	GanttOrder3D["Duration"] = "duration";
+	return GanttOrder3D;
+}({});
+var GanttHeight3D = /* @__PURE__ */ function(GanttHeight3D) {
+	GanttHeight3D["Uniform"] = "uniform";
+	GanttHeight3D["Effort"] = "effort";
+	GanttHeight3D["Progress"] = "progress";
+	return GanttHeight3D;
+}({});
+var BASE = -.42;
+var LEVEL = .15;
+/** Project plan with height: overlapping work piles up, so resource crunches show as towers. */
+var Gantt3DChart = class extends Temporal3DBase {
+	static meta = {
+		id: "gantt-3d",
+		name: "3D Gantt chart",
+		family: ChartFamily.Project,
+		dimension: Dimension.Three,
+		shape: DataShape.Table,
+		description: "Lays tasks along time, stacking overlaps upward or onto decks so workload peaks can be seen at a glance.",
+		tags: [
+			"gantt",
+			"schedule",
+			"project plan"
+		],
+		sample: (seed) => SampleData.tasks(seed, 18),
+		variants: {
+			stack: Object.values(GanttStack3D),
+			order: Object.values(GanttOrder3D),
+			heightBy: Object.values(GanttHeight3D),
+			fill: [true, false],
+			chain: [false, true]
+		},
+		valid: (values) => values.stack === "rows" || values.order === "start"
+	};
+	defaults() {
+		return {
+			task: "task",
+			start: "start",
+			end: "end",
+			group: "group",
+			progress: "progress",
+			stack: "rows",
+			order: "start",
+			heightBy: "uniform",
+			fill: true,
+			chain: false,
+			azimuth: 24,
+			elevation: 34,
+			distance: 4.7
+		};
+	}
+	/** Clean tasks: a missing end lasts a day, and a reversed range is swapped. */
+	plans() {
+		const { task, start, end, group, progress } = this.options;
+		return (this.options.data ?? []).flatMap((row, i) => {
+			const a = this.time(row[start]);
+			if (a === null) return [];
+			const b = this.time(row[end]) ?? a + 864e5;
+			const share = Math.max(0, Math.min(1, +row[progress] || 0));
+			return [{
+				task: String(row[task] ?? `Task ${i + 1}`),
+				group: String(row[group] ?? "All"),
+				start: Math.min(a, b),
+				end: Math.max(a, b, Math.min(a, b) + DAY),
+				progress: share,
+				row,
+				level: 0
+			}];
+		});
+	}
+	sorted(plans) {
+		const { order } = this.options;
+		if (order === "duration") return [...plans].sort((a, b) => b.end - b.start - (a.end - a.start));
+		if (order === "group") return [...plans].sort((a, b) => a.group.localeCompare(b.group) || a.start - b.start);
+		return [...plans].sort((a, b) => a.start - b.start);
+	}
+	/** First-fit interval colouring: a task takes the lowest level free at its start. */
+	stackUp(plans) {
+		const free = [];
+		for (const plan of [...plans].sort((a, b) => a.start - b.start)) {
+			const level = free.findIndex((end) => end <= plan.start);
+			plan.level = level < 0 ? free.length : level;
+			free[plan.level] = plan.end;
+		}
+	}
+	build(ctx) {
+		const { stack, heightBy, fill, chain } = this.options;
+		const plans = this.sorted(this.plans());
+		if (!plans.length) return;
+		const marks = new NetworkMarks3D(ctx);
+		const groups = [...new Set(plans.map((plan) => plan.group))];
+		const x = scaleTime([new Date(Math.min(...plans.map((plan) => plan.start))), new Date(Math.max(...plans.map((plan) => plan.end)))], [-1, 1]);
+		const lanes = stack === "lanes" ? groups : plans.map((plan, i) => plan.task + i);
+		const z = scaleBand(lanes, [-.95, .95]).padding(.22);
+		const deckGap = stack === "decks" ? 1.3 / Math.max(groups.length, 1) : 0;
+		if (stack === "lanes") for (const group of groups) this.stackUp(plans.filter((plan) => plan.group === group));
+		const longest = Math.max(...plans.map((plan) => plan.end - plan.start));
+		const tiers = Math.max(...plans.map((plan) => plan.level)) + 1;
+		const headroom = stack === "decks" ? deckGap * .82 : Math.min(.5, 1.25 / tiers - .03);
+		const tall = (plan) => heightBy === "effort" ? .02 + (headroom - .02) * ((plan.end - plan.start) / longest) : heightBy === "progress" ? .02 + (headroom - .02) * plan.progress : .09;
+		const pitch = heightBy === "uniform" ? LEVEL : headroom + .03;
+		const floor = (plan) => BASE + (stack === "decks" ? groups.indexOf(plan.group) * deckGap : plan.level * pitch);
+		const zOf = (plan, i) => z(stack === "lanes" ? plan.group : plan.task + i) + z.bandwidth() / 2;
+		const seats = plans.map((plan, i) => ({
+			plan,
+			x0: x(plan.start),
+			x1: x(plan.end),
+			z: zOf(plan, i)
+		}));
+		const tipOf = ({ task, group, progress, start, end }) => ({
+			title: task,
+			color: ctx.palette.color(group),
+			rows: [
+				["Group", group],
+				["Days", Math.round((end - start) / DAY)],
+				["Done", `${Math.round(progress * 100)}%`]
+			]
+		});
+		const slab = ({ plan, x0, x1, z: at }, from, to, color) => {
+			const left = x0 + (x1 - x0) * from, right = x0 + (x1 - x0) * to;
+			return {
+				at: new Vector3((left + right) / 2, floor(plan) + tall(plan) / 2, at),
+				size: new Vector3(Math.max(right - left, .002), tall(plan), Math.min(z.bandwidth(), .34)),
+				color,
+				tip: tipOf(plan)
+			};
+		};
+		const done = seats.filter(({ plan }) => !fill || plan.progress > 0);
+		marks.instances(new BoxGeometry(1, 1, 1), done.map((seat) => slab(seat, 0, fill ? seat.plan.progress : 1, ctx.palette.color(seat.plan.group))), {
+			rise: true,
+			roughness: .5
+		});
+		if (fill) marks.instances(new BoxGeometry(1, 1, 1), seats.filter(({ plan }) => plan.progress < 1).map((seat) => slab(seat, seat.plan.progress, 1, marks.faded(ctx.palette.color(seat.plan.group), .55))), {
+			rise: true,
+			opacity: .55,
+			shadow: false
+		});
+		if (chain) marks.batch(groups.flatMap((group) => {
+			const run = seats.filter(({ plan }) => plan.group === group).sort((a, b) => a.plan.start - b.plan.start);
+			return run.slice(1).map((next, i) => {
+				const from = run[i];
+				const a = new Vector3(from.x1, floor(from.plan) + tall(from.plan), from.z), b = new Vector3(next.x0, floor(next.plan) + tall(next.plan), next.z);
+				return {
+					rings: Path3D.tube(Path3D.quadratic(a, a.clone().add(b).multiplyScalar(.5).setY(Math.max(a.y, b.y) + .18), b, 14), .006, 5),
+					color: marks.faded(ctx.palette.color(group), .2)
+				};
+			});
+		}), {}, { delay: .5 });
+		const ticks = x.ticks(5);
+		marks.lines(ticks.flatMap((tick) => [new Vector3(x(tick), BASE, -1), new Vector3(x(tick), BASE, 1)]), "axis");
+		marks.ground(-.425, 1.12);
+		const spacer = new LabelSpacer3D(this.options, this.size.height);
+		for (const tick of ticks) {
+			const text = tick.toISOString().slice(5, 10), spot = [
+				x(tick),
+				-.44,
+				1.08
+			];
+			if (spacer.keep(spot, text)) ctx.label(text, spot, "muted", 10);
+		}
+	}
+};
+export { Gantt3DChart, GanttHeight3D, GanttOrder3D, GanttStack3D };

package/dist/charts/threenetwork/Graph3DBase.js

@@ -0,0 +1,165 @@
+import { Chart3D } from "../../core/Chart3D.js";
+import { NodeSizing3D } from "./enums.js";
+import { LabelSpacer3D } from "./LabelSpacer3D.js";
+import { Path3D } from "./Path3D.js";
+import { scalePow, scaleSqrt } from "d3";
+import { ConeGeometry, Quaternion, SphereGeometry, Vector3 } from "three";
+// src/charts/threenetwork/Graph3DBase.ts
+var UP = new Vector3(0, 1, 0);
+/** Shared node-link model and drawing: clean the input once, then each subclass only decides where things go. */
+var Graph3DBase = class extends Chart3D {
+	defaults() {
+		return {
+			id: "id",
+			group: "group",
+			value: "value",
+			source: "source",
+			target: "target",
+			sizeBy: NodeSizing3D.Degree
+		};
+	}
+	/** Dedupes nodes, drops links to unknown nodes and self-loops, and takes magnitudes of negative measures. */
+	model() {
+		const { data, id, group, value, source, target } = this.options;
+		const byId = /* @__PURE__ */ new Map();
+		for (const raw of data?.nodes ?? []) {
+			const key = String(raw[id] ?? "");
+			if (key && !byId.has(key)) byId.set(key, {
+				index: byId.size,
+				id: key,
+				group: String(raw[group] ?? "Other"),
+				value: Math.abs(+(raw[value] ?? 1)) || 1,
+				degree: 0,
+				radius: 0
+			});
+		}
+		const links = (data?.links ?? []).flatMap((raw) => {
+			const a = byId.get(String(raw[source])), b = byId.get(String(raw[target]));
+			if (!a || !b || a === b) return [];
+			a.degree++;
+			b.degree++;
+			return [{
+				source: a,
+				target: b,
+				value: Math.abs(+(raw[value] ?? 1)) || 1
+			}];
+		});
+		const nodes = [...byId.values()];
+		this.sizeNodes(nodes);
+		return {
+			nodes,
+			links,
+			groups: [...new Set(nodes.map((node) => node.group))]
+		};
+	}
+	/** Depth-first pass that keeps every link except those closing a cycle. */
+	acyclic(nodes, links) {
+		const outgoing = new Map(nodes.map((node) => [node, []]));
+		for (const link of links) outgoing.get(link.source).push(link);
+		const state = /* @__PURE__ */ new Map(), kept = [];
+		const visit = (node) => {
+			state.set(node, "open");
+			for (const link of outgoing.get(node)) {
+				if (state.get(link.target) === "open") continue;
+				kept.push(link);
+				if (!state.has(link.target)) visit(link.target);
+			}
+			state.set(node, "done");
+		};
+		nodes.forEach((node) => state.has(node) || visit(node));
+		return kept;
+	}
+	sizeNodes(nodes) {
+		const { sizeBy } = this.options;
+		const measure = (node) => sizeBy === NodeSizing3D.Uniform ? 1 : sizeBy === NodeSizing3D.Value ? node.value : node.degree + 1;
+		const scale = scalePow([0, Math.max(1, ...nodes.map(measure))], [0, .082]).exponent(1 / 3);
+		const fit = Math.min(1, 7 / Math.cbrt(Math.max(nodes.length, 1)) / 2);
+		for (const node of nodes) node.radius = (sizeBy === NodeSizing3D.Uniform ? .042 : scale(measure(node))) * fit;
+	}
+	drawNodes(ctx, marks, nodes, at, finish = {}) {
+		marks.instances(new SphereGeometry(1, 20, 14), nodes.map((node) => ({
+			at: at(node),
+			size: node.radius,
+			color: ctx.palette.color(node.group),
+			tip: {
+				title: node.id,
+				color: ctx.palette.color(node.group),
+				rows: [
+					["Group", node.group],
+					["Value", node.value],
+					["Links", node.degree]
+				]
+			}
+		})), {
+			roughness: .35,
+			...finish
+		});
+	}
+	/** Merged link tubes, tinted from source to target group; thickness follows the square root of the link value. */
+	drawLinks(ctx, marks, links, route, finish = {}) {
+		marks.batch(this.linkMarks(ctx, marks, links, route), {}, {
+			opacity: .8,
+			roughness: .8,
+			delay: .1,
+			...finish
+		});
+	}
+	linkMarks(ctx, marks, links, route) {
+		const width = scaleSqrt([0, Math.max(1, ...links.map((link) => link.value))], [.003, .0105]);
+		return links.map((link) => ({
+			rings: Path3D.tube(route(link), width(link.value), 5),
+			color: marks.faded(ctx.palette.color(link.source.group), .3),
+			end: marks.faded(ctx.palette.color(link.target.group), .3)
+		}));
+	}
+	/** Cones at each link's end, set back to the target's surface, for direction. */
+	drawArrows(ctx, marks, links, route) {
+		marks.instances(new ConeGeometry(1, 2.6, 12), links.flatMap((link) => {
+			const path = route(link);
+			const tip = path.at(-1), previous = path.at(-2);
+			if (!previous || previous.equals(tip)) return [];
+			const direction = tip.clone().sub(previous).normalize();
+			return [{
+				at: tip.clone().addScaledVector(direction, -link.target.radius - .03),
+				size: .014,
+				color: ctx.palette.color(link.target.group),
+				spin: new Quaternion().setFromUnitVectors(UP, direction)
+			}];
+		}), {
+			delay: .5,
+			duration: .5,
+			shadow: false
+		});
+	}
+	labelHubs(ctx, nodes, at, count = 4) {
+		const spacer = new LabelSpacer3D(this.options, this.size.height);
+		let placed = 0;
+		for (const node of [...nodes].sort((a, b) => b.degree - a.degree)) {
+			if (placed === count) break;
+			const point = at(node), spot = [
+				point.x,
+				point.y + node.radius + .05,
+				point.z
+			];
+			if (!spacer.keep(spot, node.id)) continue;
+			ctx.label(node.id, spot, "secondary", 10);
+			placed++;
+		}
+	}
+	table() {
+		const { links } = this.model();
+		return {
+			columns: [
+				"source",
+				"target",
+				"value"
+			],
+			rows: links.map((link) => [
+				link.source.id,
+				link.target.id,
+				link.value
+			])
+		};
+	}
+};
+export { Graph3DBase };

package/dist/charts/threenetwork/Hierarchy3DBase.js

@@ -0,0 +1,42 @@
+import { Chart3D } from "../../core/Chart3D.js";
+import { hierarchy } from "d3";
+// src/charts/threenetwork/Hierarchy3DBase.ts
+var ROOTLESS = { name: "" };
+/** Shared tree model: rolls leaf measures up, and colours each branch by its top-level ancestor. */
+var Hierarchy3DBase = class extends Chart3D {
+	defaults() {
+		return {
+			name: "name",
+			value: "value",
+			children: "children"
+		};
+	}
+	/** Rolled-up tree. Nulls and negative leaf values weigh nothing; `sorted` puts heavy branches first. */
+	tree(sorted = false) {
+		const { data, value, children } = this.options;
+		const root = hierarchy(data ?? ROOTLESS, (node) => node[children]).sum((node) => node[children] ? 0 : Math.max(0, +(node[value] ?? 0) || 0));
+		return sorted ? root.sort((a, b) => (b.value ?? 0) - (a.value ?? 0)) : root;
+	}
+	nameOf(node) {
+		return String(node.data[this.options.name] ?? "");
+	}
+	/** Identity colour of the top-level branch, fading a little with depth so nesting reads. */
+	branchColor(ctx, marks, node) {
+		if (!node.depth) return ctx.theme.axis;
+		const top = node.ancestors().find((step) => step.depth === 1);
+		return marks.faded(ctx.palette.color(this.nameOf(top)), Math.min(.5, (node.depth - 1) * .16));
+	}
+	tipOf(node) {
+		return {
+			title: node.ancestors().reverse().slice(1).map((step) => this.nameOf(step)).join(" / ") || this.nameOf(node),
+			rows: [["Value", Math.round((node.value ?? 0) * 100) / 100], ["Children", node.children?.length ?? 0]]
+		};
+	}
+	table() {
+		return {
+			columns: ["path", "value"],
+			rows: this.tree().leaves().map((leaf) => [leaf.ancestors().reverse().map((step) => this.nameOf(step)).join("/"), leaf.value ?? 0])
+		};
+	}
+};
+export { Hierarchy3DBase };

package/dist/charts/threenetwork/Hive3DChart.js

@@ -0,0 +1,150 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SampleData } from "../../data/SampleData.js";
+import { ForceLayout3D } from "./ForceLayout3D.js";
+import { Graph3DBase } from "./Graph3DBase.js";
+import { NetworkMarks3D } from "./NetworkMarks3D.js";
+import { Path3D } from "./Path3D.js";
+import { scaleLinear } from "d3";
+import { CylinderGeometry, Quaternion, Vector3 } from "three";
+// src/charts/threenetwork/Hive3DChart.ts
+/** How the group axes stand in space. */
+var HiveFrame3D = /* @__PURE__ */ function(HiveFrame3D) {
+	HiveFrame3D["Cone"] = "cone";
+	HiveFrame3D["Spread"] = "spread";
+	HiveFrame3D["Star"] = "star";
+	HiveFrame3D["Prism"] = "prism";
+	return HiveFrame3D;
+}({});
+var HivePosition3D = /* @__PURE__ */ function(HivePosition3D) {
+	HivePosition3D["Degree"] = "degree";
+	HivePosition3D["Value"] = "value";
+	HivePosition3D["Rank"] = "rank";
+	return HivePosition3D;
+}({});
+var HiveCurve3D = /* @__PURE__ */ function(HiveCurve3D) {
+	HiveCurve3D["Curved"] = "curved";
+	HiveCurve3D["Straight"] = "straight";
+	return HiveCurve3D;
+}({});
+var UP = new Vector3(0, 1, 0);
+var TILT = new Vector3(.6, .3, .74);
+/** Hive plot in space: a repeatable network layout where position comes from data, so two networks can be compared. */
+var Hive3DChart = class extends Graph3DBase {
+	static meta = {
+		id: "hive-3d",
+		name: "3D hive plot",
+		family: ChartFamily.Network,
+		dimension: Dimension.Three,
+		shape: DataShape.Graph,
+		description: "Places nodes on one axis per group at data-driven positions, so network structure is comparable between datasets.",
+		tags: [
+			"hive plot",
+			"network",
+			"rational layout"
+		],
+		sample: (seed) => SampleData.graph(seed, 60, 4),
+		variants: {
+			frame: Object.values(HiveFrame3D),
+			positionBy: Object.values(HivePosition3D),
+			curve: Object.values(HiveCurve3D),
+			twin: [true, false]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			frame: "cone",
+			positionBy: "degree",
+			curve: "curved",
+			twin: true,
+			elevation: 30,
+			distance: 4.9
+		};
+	}
+	axis(index, count) {
+		const angle = index / count * Math.PI * 2, flat = new Vector3(Math.cos(angle), 0, Math.sin(angle));
+		switch (this.options.frame) {
+			case "star": return {
+				from: flat.clone().multiplyScalar(.16),
+				to: flat.clone().multiplyScalar(1)
+			};
+			case "cone": return {
+				from: new Vector3(flat.x * .12, -.72, flat.z * .12),
+				to: new Vector3(flat.x * .95, .72, flat.z * .95)
+			};
+			case "prism": return {
+				from: new Vector3(flat.x * .82, -.85, flat.z * .82),
+				to: new Vector3(flat.x * .82, .85, flat.z * .82)
+			};
+			default: {
+				const direction = ForceLayout3D.sphere(index, count);
+				return {
+					from: direction.clone().multiplyScalar(.16),
+					to: direction.clone()
+				};
+			}
+		}
+	}
+	/** Twin axes sit either side of the original. Spread axes can point near-vertical, so they fan about their own perpendicular. */
+	twinOf(axis, sign) {
+		const pivot = this.options.frame === "spread" ? new Vector3().crossVectors(axis.to, TILT).normalize() : UP;
+		const spin = new Quaternion().setFromAxisAngle(pivot, sign * .17);
+		return {
+			from: axis.from.clone().applyQuaternion(spin),
+			to: axis.to.clone().applyQuaternion(spin)
+		};
+	}
+	fractions(nodes) {
+		const { positionBy } = this.options;
+		const measure = (node) => positionBy === "value" ? node.value : node.degree;
+		if (positionBy === "rank") {
+			const ranked = [...nodes].sort((a, b) => a.degree - b.degree || a.value - b.value);
+			return new Map(ranked.map((node, i) => [node, (i + .5) / ranked.length]));
+		}
+		const scale = scaleLinear([Math.min(...nodes.map(measure)), Math.max(...nodes.map(measure), 1)], [.04, 1]);
+		return new Map(nodes.map((node) => [node, scale(measure(node))]));
+	}
+	build(ctx) {
+		const { nodes, links, groups } = this.model();
+		if (!nodes.length) return;
+		const { twin, curve } = this.options;
+		const marks = new NetworkMarks3D(ctx);
+		for (const node of nodes) node.radius *= .68;
+		const axes = groups.map((_, g) => this.axis(g, groups.length));
+		const left = twin ? axes.map((axis) => this.twinOf(axis, -1)) : axes;
+		const right = twin ? axes.map((axis) => this.twinOf(axis, 1)) : axes;
+		const fractions = new Map(groups.flatMap((group) => [...this.fractions(nodes.filter((node) => node.group === group))]));
+		const on = (set, node) => {
+			const axis = set[groups.indexOf(node.group)];
+			return axis.from.clone().lerp(axis.to, fractions.get(node));
+		};
+		const route = (link) => {
+			const a = on(right, link.source), b = on(left, link.target);
+			if (curve === "straight") return [a, b];
+			const middle = a.clone().add(b).multiplyScalar(link.source.group === link.target.group ? .62 : .26);
+			return Path3D.quadratic(a, middle, b, 18);
+		};
+		this.drawLinks(ctx, marks, links, route, { opacity: .62 });
+		const rails = [.../* @__PURE__ */ new Set([...left, ...right])];
+		marks.instances(new CylinderGeometry(1, 1, 1, 10), rails.map((rail) => {
+			const direction = rail.to.clone().sub(rail.from);
+			return {
+				at: rail.from.clone().add(rail.to).multiplyScalar(.5),
+				size: new Vector3(.0075, direction.length(), .0075),
+				color: ctx.theme.axis,
+				spin: new Quaternion().setFromUnitVectors(UP, direction.clone().normalize())
+			};
+		}), { shadow: false });
+		this.drawNodes(ctx, marks, nodes, (node) => on(left, node));
+		if (twin) this.drawNodes(ctx, marks, nodes, (node) => on(right, node));
+		groups.forEach((group, g) => {
+			const tip = axes[g].to;
+			ctx.label(group, [
+				tip.x * 1.1,
+				tip.y * 1.1,
+				tip.z * 1.1
+			], "secondary", 10);
+		});
+	}
+};
+export { Hive3DChart, HiveCurve3D, HiveFrame3D, HivePosition3D };