@mstone6969/graph 0.0.0-stage → 0.2.0

package/dist/charts/earthscience/SimplexField.js

@@ -0,0 +1,118 @@
+// src/charts/earthscience/SimplexField.ts
+var RISE = Math.sqrt(3) / 2;
+/** Multiplicative replacement of zero parts, so that log-ratios stay finite. */
+var ZERO = .005;
+var planar = ({ a, c }) => [c + a / 2, a * RISE];
+var closed = (a, b, c) => {
+	const [x, y, z] = [
+		Math.max(a, ZERO),
+		Math.max(b, ZERO),
+		Math.max(c, ZERO)
+	], total = x + y + z;
+	return {
+		a: x / total,
+		b: y / total,
+		c: z / total
+	};
+};
+/** Isometric log-ratio coordinates: Euclidean distance here is Aitchison distance on the simplex. */
+var logRatio = (raw) => {
+	const { a, b, c } = closed(raw.a, raw.b, raw.c);
+	return [Math.log(a / b) / Math.SQRT2, Math.log(a * b / (c * c)) / Math.sqrt(6)];
+};
+/** Scalar surfaces over a ternary simplex, from sample density or from sampled values. */
+var SimplexField = class {
+	/** Gaussian kernel density at three quarters of Silverman's bandwidth (σ n^(-1/6) in two dimensions), in the plane or in log-ratio space. */
+	static density(rows, logarithmic) {
+		const project = logarithmic ? logRatio : planar;
+		const points = rows.map(project);
+		const spread = (k) => {
+			const mean = points.reduce((sum, p) => sum + p[k], 0) / (points.length || 1);
+			return points.reduce((sum, p) => sum + (p[k] - mean) ** 2, 0) / (points.length || 1);
+		};
+		const sigma = Math.sqrt((spread(0) + spread(1)) / 2);
+		const h = Math.max(sigma * .75 * (points.length || 1) ** (-1 / 6), logarithmic ? .12 : .02);
+		const scale = -.5 / (h * h);
+		return (a, b, c) => {
+			const [x, y] = project({
+				a,
+				b,
+				c
+			});
+			return points.reduce((sum, p) => sum + Math.exp(((x - p[0]) ** 2 + (y - p[1]) ** 2) * scale), 0);
+		};
+	}
+	/** Shepard interpolation: honours every sample exactly. */
+	static inverseDistance(rows) {
+		const points = rows.flatMap((row) => row.value === null ? [] : [{
+			p: planar(row),
+			value: row.value
+		}]);
+		return (a, _b, c) => {
+			const [x, y] = planar({
+				a,
+				c
+			});
+			let top = 0, bottom = 0;
+			for (const { p, value } of points) {
+				const weight = 1 / ((x - p[0]) ** 2 + (y - p[1]) ** 2 + 1e-6) ** 2;
+				top += weight * value;
+				bottom += weight;
+			}
+			return bottom ? top / bottom : 0;
+		};
+	}
+	/** Scheffé canonical mixture polynomial by least squares: quadratic, or special cubic with the three-way blend. */
+	static scheffe(rows, cubic) {
+		const basis = (a, b, c) => cubic ? [
+			a,
+			b,
+			c,
+			a * b,
+			a * c,
+			b * c,
+			a * b * c
+		] : [
+			a,
+			b,
+			c,
+			a * b,
+			a * c,
+			b * c
+		];
+		const size = cubic ? 7 : 6;
+		const normal = Array.from({ length: size }, () => new Array(size + 1).fill(0));
+		for (const row of rows) {
+			if (row.value === null) continue;
+			const terms = basis(row.a, row.b, row.c);
+			for (let i = 0; i < size; i++) {
+				for (let j = 0; j < size; j++) normal[i][j] += terms[i] * terms[j];
+				normal[i][size] += terms[i] * row.value;
+			}
+		}
+		for (let i = 0; i < size; i++) normal[i][i] += 1e-8;
+		const beta = solve(normal);
+		return (a, b, c) => basis(a, b, c).reduce((sum, term, i) => sum + term * beta[i], 0);
+	}
+};
+/** Gaussian elimination with partial pivoting, on an augmented matrix. */
+function solve(matrix) {
+	const n = matrix.length;
+	for (let col = 0; col < n; col++) {
+		let pivot = col;
+		for (let row = col + 1; row < n; row++) if (Math.abs(matrix[row][col]) > Math.abs(matrix[pivot][col])) pivot = row;
+		[matrix[col], matrix[pivot]] = [matrix[pivot], matrix[col]];
+		for (let row = col + 1; row < n; row++) {
+			const factor = matrix[row][col] / matrix[col][col];
+			for (let k = col; k <= n; k++) matrix[row][k] -= factor * matrix[col][k];
+		}
+	}
+	const beta = new Array(n).fill(0);
+	for (let row = n - 1; row >= 0; row--) {
+		let rest = matrix[row][n];
+		for (let k = row + 1; k < n; k++) rest -= matrix[row][k] * beta[k];
+		beta[row] = rest / matrix[row][row];
+	}
+	return beta;
+}
+export { SimplexField };

package/dist/charts/earthscience/TernaryContour.js

@@ -0,0 +1,262 @@
+import { Chart2D } from "../../core/Chart2D.js";
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { Scales } from "../../core/Scales.js";
+import { Draft } from "../scientific/Draft.js";
+import { Simplex } from "../scientific/Simplex.js";
+import { EarthSample } from "./EarthSample.js";
+import { SimplexContours } from "./SimplexContours.js";
+import { SimplexField } from "./SimplexField.js";
+import { ascending, quantileSorted, ticks } from "d3";
+// src/charts/earthscience/TernaryContour.ts
+/** Where the contoured surface comes from: sample density, or a value interpolated or modelled across the triangle. */
+var TernarySurface = /* @__PURE__ */ function(TernarySurface) {
+	TernarySurface["Density"] = "density";
+	TernarySurface["LogRatioDensity"] = "log-ratio-density";
+	TernarySurface["InverseDistance"] = "inverse-distance";
+	TernarySurface["ScheffeQuadratic"] = "scheffe-quadratic";
+	TernarySurface["ScheffeCubic"] = "scheffe-special-cubic";
+	return TernarySurface;
+}({});
+var TernaryContourStyle = /* @__PURE__ */ function(TernaryContourStyle) {
+	TernaryContourStyle["FilledLines"] = "filled-lines";
+	TernaryContourStyle["Filled"] = "filled";
+	TernaryContourStyle["Lines"] = "lines";
+	return TernaryContourStyle;
+}({});
+/** Equal steps of the surface, or levels set by the samples: for density, regions holding a stated share of them. */
+var TernaryLevelRule = /* @__PURE__ */ function(TernaryLevelRule) {
+	TernaryLevelRule["Equal"] = "equal-interval";
+	TernaryLevelRule["Quantile"] = "quantile";
+	return TernaryLevelRule;
+}({});
+var DENSITIES = ["density", "log-ratio-density"];
+var ELBOW = 34;
+var capital = (text) => text.charAt(0).toUpperCase() + text.slice(1);
+var percent = (share) => `${Math.round(share * 100)}%`;
+/** Density or value contours on a ternary triangle, for reading how a quantity varies across a three-part composition. */
+var TernaryContour = class extends Chart2D {
+	static meta = {
+		id: "ternary-contour",
+		name: "Ternary contour",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Contours sample density or a measured value across a ternary triangle, from a kernel estimate, interpolation or a mixture model.",
+		tags: [
+			"simplex",
+			"mixture",
+			"scheffe",
+			"sediment",
+			"isopleth",
+			"highest density region"
+		],
+		sample: (seed) => EarthSample.sediments(seed),
+		variants: {
+			surface: Object.values(TernarySurface),
+			style: Object.values(TernaryContourStyle),
+			rule: Object.values(TernaryLevelRule),
+			points: [false, true],
+			labels: [false, true]
+		},
+		valid: (values) => !(values.labels && values.style === "filled")
+	};
+	#legend = [];
+	defaults() {
+		return {
+			a: "sand",
+			b: "clay",
+			c: "silt",
+			value: "porosity",
+			surface: "density",
+			style: "filled-lines",
+			rule: "equal-interval",
+			levels: 5,
+			points: false,
+			labels: false
+		};
+	}
+	plotMargin() {
+		return {
+			top: 20,
+			right: 34,
+			bottom: 24,
+			left: 34
+		};
+	}
+	legendItems() {
+		return this.#legend;
+	}
+	compositions() {
+		const { data, a, b, c, value } = this.options;
+		return data.flatMap((row) => {
+			const [x, y, z] = [
+				row[a],
+				row[b],
+				row[c]
+			].map(Draft.number);
+			if (x == null || y == null || z == null || x < 0 || y < 0 || z < 0) return [];
+			const total = x + y + z;
+			return total > 0 ? [{
+				a: x / total,
+				b: y / total,
+				c: z / total,
+				value: Draft.number(row[value])
+			}] : [];
+		});
+	}
+	surface(rows) {
+		const { surface } = this.options;
+		if (surface === "density" || surface === "log-ratio-density") return rows.length ? SimplexField.density(rows, surface === "log-ratio-density") : null;
+		if (!rows.some((row) => row.value !== null)) return null;
+		if (surface === "inverse-distance") return SimplexField.inverseDistance(rows);
+		return SimplexField.scheffe(rows, surface === "scheffe-special-cubic");
+	}
+	/** Level values ascending. Quantile levels read the fitted surface at the samples, which for density gives highest-density regions. */
+	levels(rows, surface, grid) {
+		const { levels, rule } = this.options;
+		const { lowest, highest } = grid;
+		if (!(highest > lowest)) return [];
+		const count = Math.max(1, Math.round(levels));
+		const quantile = rule === "quantile";
+		const fitted = rows.map((row) => surface(row.a, row.b, row.c)).sort(ascending);
+		const shares = Array.from({ length: count }, (_, k) => (k + 1) / (count + 1));
+		if (DENSITIES.includes(this.options.surface)) {
+			if (quantile) return [...new Set(shares.map((share) => Math.round((1 - share) * 20) / 20))].map((share) => ({
+				value: quantileSorted(fitted, 1 - share),
+				legend: `${percent(share)} of samples`,
+				caption: percent(share)
+			})).filter((level) => level.value > lowest);
+			return ticks(0, 1, count).filter((share) => share > 0 && share < 1).map((share) => ({
+				value: highest * share,
+				legend: `≥ ${percent(share)} of peak`,
+				caption: percent(share)
+			}));
+		}
+		const reach = Math.max(Math.abs(lowest), Math.abs(highest));
+		const places = quantile ? shares.map((share) => quantileSorted(fitted, share)) : ticks(lowest, highest, count);
+		const inner = [...new Set(places)].filter((value) => value > lowest && value < highest).map((value) => ({
+			value,
+			legend: `≥ ${Scales.format(value, reach)}`,
+			caption: Scales.format(value, reach)
+		}));
+		return inner.length ? [{
+			value: lowest,
+			legend: `< ${inner[0].caption}`,
+			caption: Scales.format(lowest, reach)
+		}, ...inner] : [];
+	}
+	draw(ctx) {
+		Draft.fresh(ctx, this.meta, this.options);
+		const { a, b, c, aLabel, bLabel, cLabel, style, value, valueLabel, labels, points } = this.options;
+		const density = DENSITIES.includes(this.options.surface);
+		const rows = this.compositions();
+		const simplex = Simplex.fit({ ...ctx.plot });
+		const surface = this.surface(rows);
+		const grid = surface ? new SimplexContours(simplex, surface) : null;
+		const levels = surface && grid ? this.levels(rows, surface, grid) : [];
+		const filled = style !== "lines", stroked = style !== "filled";
+		const tone = (i) => .15 + .85 * i / Math.max(1, levels.length - 1);
+		const bands = levels.map((level, i) => ({
+			...level,
+			d: grid.band(level.value),
+			tone: tone(i),
+			upper: levels[i + 1]?.caption ?? ""
+		}));
+		const name = valueLabel ?? capital(value);
+		const third = density ? "Density" : name;
+		const fills = ctx.marks("tc-fills", "path", filled ? bands : [], (_, i) => i).attr("fill", (band) => ctx.palette.sequential(band.tone));
+		ctx.set(fills, { d: (band) => band.d }, { d: (band) => band.d });
+		ctx.hover(fills, (band) => ({
+			title: third,
+			color: ctx.palette.sequential(band.tone),
+			rows: [["Level", band.upper ? `${band.caption} to ${band.upper}` : `${band.caption} and above`]]
+		}));
+		Draft.rules(ctx, "tc-grid", simplex.grid(10), filled && bands.length ? {
+			stroke: ctx.theme.surface,
+			opacity: .22
+		} : {});
+		this.drawLines(ctx, grid, bands.filter((band) => stroked && (density || band.value > grid.lowest)), filled, third);
+		Draft.paths(ctx, "tc-outline", [simplex.outline], { stroke: ctx.theme.axis });
+		const scale = simplex.labels(10, (_, t) => `${Math.round(t * 100)}`).filter((_, i) => (Math.floor(i / 3) + 1) % 2 === 0);
+		Draft.captions(ctx, "tc-scale", scale);
+		Draft.captions(ctx, "tc-corners", simplex.corners(aLabel ?? capital(a), bLabel ?? capital(b), cLabel ?? capital(c)));
+		this.drawPoints(ctx, points ? rows : [], simplex, third);
+		this.drawInlineLabels(ctx, labels && stroked && grid ? bands.filter((band) => density || band.value > grid.lowest).map((band) => ({
+			band,
+			chains: grid.lines(band.value)
+		})) : [], simplex);
+		this.#legend = bands.map((band) => ({
+			key: band.legend,
+			color: ctx.palette.sequential(filled ? band.tone : .35 + .65 * band.tone)
+		}));
+	}
+	drawLines(ctx, grid, bands, filled, title) {
+		const lines = bands.map((band) => ({
+			band,
+			d: grid.lines(band.value).map(Draft.polyline).join("")
+		}));
+		const paths = ctx.marks("tc-lines", "path", lines, (_, i) => i).attr("fill", "none").attr("stroke-linejoin", "round").attr("stroke-linecap", "round").attr("stroke", (line) => filled ? ctx.theme.surface : ctx.palette.sequential(.35 + .65 * line.band.tone)).attr("stroke-width", filled ? 1 : 2).attr("stroke-opacity", filled ? .75 : 1);
+		ctx.set(paths, { d: (line) => line.d }, { d: (line) => line.d });
+		if (filled) paths.style("pointer-events", "none");
+		else ctx.hover(paths, (line) => ({
+			title,
+			rows: [["Level", line.band.caption]]
+		}));
+	}
+	/** One label per level, on its longest chain, set along the line and kept apart from the others. */
+	drawInlineLabels(ctx, levels, simplex) {
+		const placed = [];
+		const clear = (x, y) => placed.every((other) => Math.hypot(other.x - x, other.y - y) > ELBOW);
+		for (const { band, chains } of levels) {
+			const chain = chains.reduce((best, next) => next.length > best.length ? next : best, []);
+			const room = Math.ceil(band.caption.length * 6.2 / 6) + 2;
+			if (chain.length < room * 2 + 1) continue;
+			const spot = [
+				.5,
+				.3,
+				.7
+			].map((share) => Math.round(share * (chain.length - 1))).find((i) => {
+				const [x, y] = chain[i];
+				const p = chain[Math.max(0, i - room)], q = chain[Math.min(chain.length - 1, i + room)];
+				return i >= room && i < chain.length - room && clear(x, y) && simplex.contains(p[0], p[1]) && simplex.contains(q[0], q[1]);
+			});
+			if (spot === void 0) continue;
+			const [x, y] = chain[spot];
+			const p = chain[spot - room], q = chain[spot + room];
+			const slope = Math.atan2(q[1] - p[1], q[0] - p[0]) * 180 / Math.PI;
+			placed.push({
+				text: band.caption,
+				x,
+				y: y + 3.5,
+				rotate: Math.abs(slope) > 90 ? slope - Math.sign(slope) * 180 : slope,
+				size: 10.5,
+				tone: "ink"
+			});
+		}
+		Draft.captions(ctx, "tc-labels", placed).attr("paint-order", "stroke").attr("stroke", ctx.theme.surface).attr("stroke-width", 3).attr("stroke-linejoin", "round");
+	}
+	drawPoints(ctx, rows, simplex, title) {
+		const { a, b, c, aLabel, bLabel, cLabel } = this.options;
+		const dots = ctx.marks("tc-points", "circle", rows, (_, i) => i).attr("fill", ctx.theme.ink).attr("stroke", ctx.theme.surface).attr("stroke-width", 2);
+		const cx = (d) => simplex.at(d.a, d.b, d.c)[0], cy = (d) => simplex.at(d.a, d.b, d.c)[1];
+		ctx.set(dots, {
+			cx,
+			cy,
+			r: 4
+		}, {
+			cx,
+			cy,
+			r: 0
+		}, 2);
+		ctx.hover(dots, (d) => ({
+			title: "Sample",
+			rows: [
+				[aLabel ?? capital(a), percent(d.a)],
+				[bLabel ?? capital(b), percent(d.b)],
+				[cLabel ?? capital(c), percent(d.c)],
+				...d.value === null || title === "Density" ? [] : [[title, d.value]]
+			]
+		}));
+	}
+};
+export { TernaryContour, TernaryContourStyle, TernaryLevelRule, TernarySurface };

package/dist/charts/earthscience/index.js

@@ -0,0 +1,14 @@
+import { HovmollerGuides, HovmollerLongitudes, HovmollerReference, HovmollerSection, HovmollerStyle, HovmollerTimeFlow } from "./HovmollerEnums.js";
+import { HovmollerField } from "./HovmollerField.js";
+import { HovmollerSpeed } from "./HovmollerSpeed.js";
+import { HovmollerDiagram } from "./HovmollerDiagram.js";
+import { BaseflowMethod, BaseflowSeparation } from "./BaseflowSeparation.js";
+import { Hydrograph } from "./Hydrograph.js";
+import { TernaryContour, TernaryContourStyle, TernaryLevelRule, TernarySurface } from "./TernaryContour.js";
+// src/charts/earthscience/index.ts
+var earthscienceCatalog = [
+	HovmollerDiagram,
+	Hydrograph,
+	TernaryContour
+];
+export { BaseflowMethod, BaseflowSeparation, HovmollerDiagram, HovmollerField, HovmollerGuides, HovmollerLongitudes, HovmollerReference, HovmollerSection, HovmollerSpeed, HovmollerStyle, HovmollerTimeFlow, Hydrograph, TernaryContour, TernaryContourStyle, TernaryLevelRule, TernarySurface, earthscienceCatalog };

package/dist/charts/engineering/BodePlot.js

@@ -0,0 +1,211 @@
+import { ChartFamily, DataShape, Dimension, ScaleKind } from "../../core/enums.js";
+import { Scales } from "../../core/Scales.js";
+import { FrequencyResponseChart } from "./FrequencyResponseChart.js";
+import { TransferFunction } from "./TransferFunction.js";
+// src/charts/engineering/BodePlot.ts
+var BodeView = /* @__PURE__ */ function(BodeView) {
+	BodeView["Both"] = "magnitude-phase";
+	BodeView["Magnitude"] = "magnitude";
+	BodeView["Phase"] = "phase";
+	return BodeView;
+}({});
+var BodeMagnitudeUnit = /* @__PURE__ */ function(BodeMagnitudeUnit) {
+	BodeMagnitudeUnit["Decibel"] = "decibel";
+	BodeMagnitudeUnit["Ratio"] = "ratio";
+	return BodeMagnitudeUnit;
+}({});
+var BodePhaseRange = /* @__PURE__ */ function(BodePhaseRange) {
+	BodePhaseRange["Unwrapped"] = "unwrapped";
+	BodePhaseRange["Wrapped"] = "wrapped";
+	return BodePhaseRange;
+}({});
+var wrap = (phase) => phase - 360 * Math.ceil((phase - 180) / 360);
+var degrees = (value) => `${value}°`;
+/** Read gain and phase against frequency on the shared log axis control engineers tune loops with. */
+var BodePlot = class extends FrequencyResponseChart {
+	static meta = {
+		id: "bode-plot",
+		name: "Bode plot",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Shows the gain and phase of a linear system against frequency, with stability margins.",
+		tags: [
+			"control",
+			"frequency response",
+			"gain margin",
+			"phase margin",
+			"filter"
+		],
+		sample: (seed) => TransferFunction.demoResponse(seed),
+		variants: {
+			view: [
+				"magnitude-phase",
+				"magnitude",
+				"phase"
+			],
+			unit: ["decibel", "ratio"],
+			phaseRange: ["unwrapped", "wrapped"],
+			frequencyScale: [ScaleKind.Log, ScaleKind.Linear],
+			margins: [true, false]
+		},
+		valid: (v) => !(v.view === "magnitude" && v.phaseRange !== "unwrapped") && !(v.view === "phase" && v.unit !== "decibel")
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			view: "magnitude-phase",
+			unit: "decibel",
+			phaseRange: "unwrapped",
+			frequencyScale: ScaleKind.Log,
+			margins: true,
+			rolloff: 40
+		};
+	}
+	trimmed(loops) {
+		if (this.options.frequencyScale === ScaleKind.Log) return loops;
+		return loops.map((loop) => {
+			const peak = Math.max(...loop.points.map((p) => p.magnitude));
+			const end = loop.points.findIndex((p) => p.magnitude < peak - this.options.rolloff);
+			return {
+				...loop,
+				points: end > 1 ? loop.points.slice(0, end) : loop.points
+			};
+		});
+	}
+	draw(ctx) {
+		const { view, frequencyScale, xLabel } = this.options;
+		const { width, height } = ctx.plot;
+		const loops = this.trimmed(this.responses());
+		const log = frequencyScale === ScaleKind.Log;
+		const x = Scales.continuous(frequencyScale).domain(this.span(loops.flatMap((l) => l.points.map((p) => p.frequency)), { log })).range([0, width]);
+		const both = view === "magnitude-phase";
+		const gap = both ? 10 : 0;
+		const upper = both ? Math.round((height - gap) * .56) : height;
+		const title = xLabel ?? "Frequency (rad/s)";
+		if (view !== "phase") this.magnitudePanel(ctx.nest("translate(0,0)", "gain"), loops, x, upper, both ? void 0 : title, both);
+		if (view !== "magnitude") this.phasePanel(ctx.nest(`translate(0,${both ? upper + gap : 0})`, "phase"), loops, x, height - (both ? upper + gap : 0), title);
+	}
+	magnitudePanel(ctx, loops, x, height, xTitle, hideX) {
+		const ratio = this.options.unit === "ratio";
+		const value = (p) => ratio ? 10 ** (p.magnitude / 20) : p.magnitude;
+		const y = Scales.continuous(ratio ? ScaleKind.Log : ScaleKind.Linear).domain(this.span(loops.flatMap((l) => l.points.map(value)), {
+			log: ratio,
+			pad: ratio ? 0 : .04
+		})).range([height, 0]);
+		if (!ratio) y.nice();
+		const unity = ratio ? 1 : 0;
+		this.frame(ctx, {
+			x,
+			y,
+			hideX,
+			xTitle,
+			yTitle: this.options.yLabel ?? (ratio ? "Gain" : "Gain (dB)")
+		});
+		const at = (p) => [x(p.frequency), y(value(p))];
+		this.traces(ctx, "curves", loops.map((loop) => ({
+			key: loop.system,
+			color: ctx.palette.color(loop.system),
+			points: loop.points.map(at)
+		})));
+		if (this.options.margins) {
+			const marks = loops.flatMap((loop) => {
+				const cross = this.margins(loop).phaseCross;
+				return cross && x(cross.frequency) <= x.range()[1] ? [{
+					key: loop.system,
+					cross,
+					points: [[x(cross.frequency), y(unity)], at(cross)],
+					color: ctx.palette.color(loop.system)
+				}] : [];
+			});
+			this.traces(ctx, "gain-margin", marks.map((mark) => ({
+				...mark,
+				dash: "2 3"
+			})));
+			this.dots(ctx, "gain-margin-dot", marks, (d) => d.points[1], (d) => d.color, (d) => ({
+				title: `${d.key} gain margin`,
+				color: d.color,
+				rows: [["Margin", `${(-d.cross.magnitude).toFixed(1)} dB`], ["At", `${d.cross.frequency.toFixed(2)} rad/s`]]
+			}), 4);
+			this.annotate(ctx, "gain-margin-note", marks.slice(0, 1).map((d) => ({
+				key: d.key,
+				text: `GM ${(-d.cross.magnitude).toFixed(1)} dB`,
+				x: d.points[1][0] + 8,
+				y: d.points[1][1] + 4
+			})), {
+				width: Math.max(...x.range()),
+				height
+			});
+		}
+		for (const loop of loops) this.probes(ctx, `probe-${loops.indexOf(loop)}`, loop.points, at, (p) => this.tipFor(ctx, p));
+	}
+	phasePanel(ctx, loops, x, height, xTitle) {
+		const wrapped = this.options.phaseRange === "wrapped";
+		const value = (p) => wrapped ? wrap(p.phase) : p.phase;
+		const [low, high] = wrapped ? [-180, 180] : this.span([...loops.flatMap((l) => l.points.map(value)), this.options.margins ? -180 : NaN]);
+		const step = high - low > 400 ? 180 : height < 90 ? 90 : 45;
+		const y = Scales.continuous(ScaleKind.Linear).domain([Math.floor(low / step) * step, Math.ceil(high / step) * step]).range([height, 0]);
+		const domain = y.domain();
+		const yValues = Array.from({ length: Math.round((domain[1] - domain[0]) / step) + 1 }, (_, i) => domain[0] + i * step);
+		this.frame(ctx, {
+			x,
+			y,
+			xTitle,
+			yTitle: this.options.view === "magnitude-phase" ? "Phase" : "Phase (deg)",
+			yValues,
+			yFormat: degrees
+		});
+		const at = (p) => [x(p.frequency), y(value(p))];
+		const broken = (loop) => loop.points.flatMap((p, i) => {
+			const last = loop.points[i - 1];
+			return last && Math.abs(value(p) - value(last)) > 180 ? [[NaN, NaN], at(p)] : [at(p)];
+		});
+		this.traces(ctx, "curves", loops.map((loop) => ({
+			key: loop.system,
+			color: ctx.palette.color(loop.system),
+			points: broken(loop)
+		})));
+		if (this.options.margins) {
+			const marks = loops.flatMap((loop) => {
+				const cross = this.margins(loop).gainCross;
+				return cross ? [{
+					key: loop.system,
+					cross,
+					points: [[x(cross.frequency), y(-180)], at(cross)],
+					color: ctx.palette.color(loop.system)
+				}] : [];
+			});
+			this.traces(ctx, "phase-margin", marks.map((mark) => ({
+				...mark,
+				dash: "2 3"
+			})));
+			this.dots(ctx, "phase-margin-dot", marks, (d) => d.points[1], (d) => d.color, (d) => ({
+				title: `${d.key} phase margin`,
+				color: d.color,
+				rows: [["Margin", `${(d.cross.phase + 180).toFixed(1)}°`], ["At", `${d.cross.frequency.toFixed(2)} rad/s`]]
+			}), 4);
+			this.annotate(ctx, "phase-margin-note", marks.slice(0, 1).map((d) => ({
+				key: d.key,
+				text: `PM ${(d.cross.phase + 180).toFixed(1)}°`,
+				x: d.points[1][0] + 8,
+				y: d.points[1][1] - 6
+			})), {
+				width: Math.max(...x.range()),
+				height
+			});
+		}
+		for (const loop of loops) this.probes(ctx, `probe-${loops.indexOf(loop)}`, loop.points, at, (p) => this.tipFor(ctx, p));
+	}
+	tipFor(ctx, p) {
+		return {
+			title: p.system,
+			color: ctx.palette.color(p.system),
+			rows: [
+				["Frequency", p.frequency.toPrecision(3)],
+				["Gain", `${p.magnitude.toFixed(1)} dB`],
+				["Phase", `${p.phase.toFixed(1)}°`]
+			]
+		};
+	}
+};
+export { BodeMagnitudeUnit, BodePhaseRange, BodePlot, BodeView };

package/dist/charts/engineering/ComplexMath.js

@@ -0,0 +1,50 @@
+// src/charts/engineering/ComplexMath.ts
+/** The handful of complex operations the control and RF charts need. */
+var ComplexMath = class ComplexMath {
+	static add(a, b) {
+		return [a[0] + b[0], a[1] + b[1]];
+	}
+	static sub(a, b) {
+		return [a[0] - b[0], a[1] - b[1]];
+	}
+	static mul(a, b) {
+		return [a[0] * b[0] - a[1] * b[1], a[0] * b[1] + a[1] * b[0]];
+	}
+	static div(a, b) {
+		const size = b[0] * b[0] + b[1] * b[1] || Number.MIN_VALUE;
+		return [(a[0] * b[0] + a[1] * b[1]) / size, (a[1] * b[0] - a[0] * b[1]) / size];
+	}
+	static abs(a) {
+		return Math.hypot(a[0], a[1]);
+	}
+	static arg(a) {
+		return Math.atan2(a[1], a[0]);
+	}
+	static polar(radius, angle) {
+		return [radius * Math.cos(angle), radius * Math.sin(angle)];
+	}
+	/** Coefficients, highest power first, of the monic polynomial with these roots. */
+	static expand(roots) {
+		return roots.reduce((coefficients, root) => {
+			const next = [...coefficients, [0, 0]];
+			coefficients.forEach((c, i) => {
+				next[i + 1] = ComplexMath.sub(next[i + 1], ComplexMath.mul(c, root));
+			});
+			return next;
+		}, [[1, 0]]);
+	}
+	/** Durand-Kerner root finder. Passing the previous roots keeps each branch in its slot. */
+	static roots(coefficients, start) {
+		const monic = coefficients.map((c) => ComplexMath.div(c, coefficients[0]));
+		const degree = monic.length - 1;
+		const reach = 1 + Math.max(0, ...monic.slice(1).map(ComplexMath.abs));
+		const roots = start?.map((root) => [...root]) ?? Array.from({ length: degree }, (_, i) => ComplexMath.polar(reach, 2 * Math.PI * i / degree + .4));
+		for (let pass = 0; pass < (start ? 24 : 120); pass++) roots.forEach((root, i) => {
+			const value = monic.reduce((sum, c) => ComplexMath.add(ComplexMath.mul(sum, root), c), [0, 0]);
+			const spread = roots.reduce((product, other, j) => j === i ? product : ComplexMath.mul(product, ComplexMath.sub(root, other)), [1, 0]);
+			roots[i] = ComplexMath.sub(root, ComplexMath.div(value, spread));
+		});
+		return roots;
+	}
+};
+export { ComplexMath };