@mstone6969/graph 0.0.0-stage → 0.2.0

package/dist/charts/engineering/ConstellationDiagram.js

@@ -0,0 +1,280 @@
+import { ChartFamily, DataShape, Dimension, SymbolKind } from "../../core/enums.js";
+import { Scales } from "../../core/Scales.js";
+import { SampleData } from "../../data/SampleData.js";
+import { EngineeringChart } from "./EngineeringChart.js";
+import { Delaunay, contourDensity, geoPath, max, scaleLinear, symbol } from "d3";
+// src/charts/engineering/ConstellationDiagram.ts
+var ConstellationModulation = /* @__PURE__ */ function(ConstellationModulation) {
+	ConstellationModulation["Qpsk"] = "qpsk";
+	ConstellationModulation["Psk8"] = "8psk";
+	ConstellationModulation["Qam16"] = "16qam";
+	ConstellationModulation["Qam64"] = "64qam";
+	return ConstellationModulation;
+}({});
+var ConstellationRender = /* @__PURE__ */ function(ConstellationRender) {
+	ConstellationRender["Points"] = "points";
+	ConstellationRender["Density"] = "density";
+	ConstellationRender["Path"] = "symbol-path";
+	return ConstellationRender;
+}({});
+var ConstellationReference = /* @__PURE__ */ function(ConstellationReference) {
+	ConstellationReference["None"] = "unreferenced";
+	ConstellationReference["Lattice"] = "lattice";
+	ConstellationReference["ErrorVectors"] = "error-vectors";
+	return ConstellationReference;
+}({});
+var ConstellationEncoding = /* @__PURE__ */ function(ConstellationEncoding) {
+	ConstellationEncoding["Single"] = "single";
+	ConstellationEncoding["Quadrant"] = "by-quadrant";
+	ConstellationEncoding["Error"] = "by-error";
+	return ConstellationEncoding;
+}({});
+var ConstellationView = /* @__PURE__ */ function(ConstellationView) {
+	ConstellationView["Cartesian"] = "i-q";
+	ConstellationView["Polar"] = "phase-amplitude";
+	return ConstellationView;
+}({});
+var QUADRANT_SYMBOLS = [
+	SymbolKind.Circle,
+	SymbolKind.Square,
+	SymbolKind.Triangle,
+	SymbolKind.Diamond
+];
+function lattice(modulation) {
+	if (modulation === "qpsk" || modulation === "8psk") {
+		const n = modulation === "qpsk" ? 4 : 8;
+		return Array.from({ length: n }, (_, k) => [Math.cos(2 * Math.PI * (k + (n === 4 ? .5 : 0)) / n), Math.sin(2 * Math.PI * (k + (n === 4 ? .5 : 0)) / n)]);
+	}
+	const side = modulation === "16qam" ? 4 : 8;
+	const power = Math.sqrt(2 * (side * side - 1) / 3);
+	return Array.from({ length: side * side }, (_, k) => [(2 * (k % side) - side + 1) / power, (2 * Math.floor(k / side) - side + 1) / power]);
+}
+function sampleSymbols(seed) {
+	const ideal = lattice("16qam");
+	return SampleData.points(seed, 600, 1).map((row, n) => {
+		const n1 = (+row.x - 20) / 8, n2 = (+row.y - +row.x * .8 - 10) / 9;
+		const [a, b] = ideal[(n * 7 + Math.floor(+row.size * 10)) % 16];
+		return {
+			i: +(a + n1 * .045).toFixed(4),
+			q: +(b + n2 * .045).toFixed(4)
+		};
+	});
+}
+/** Inspect a digital modem: received symbols against the ideal lattice, with error vector magnitude. */
+var ConstellationDiagram = class extends EngineeringChart {
+	static meta = {
+		id: "constellation-diagram",
+		name: "Constellation diagram",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Scatters received I/Q symbols against the ideal modulation lattice to expose noise and EVM.",
+		tags: [
+			"modulation",
+			"qam",
+			"psk",
+			"iq",
+			"evm",
+			"rf"
+		],
+		sample: sampleSymbols,
+		variants: {
+			render: [
+				"points",
+				"density",
+				"symbol-path"
+			],
+			reference: [
+				"lattice",
+				"unreferenced",
+				"error-vectors"
+			],
+			encoding: [
+				"single",
+				"by-quadrant",
+				"by-error"
+			],
+			view: ["i-q", "phase-amplitude"],
+			boundaries: [true, false],
+			ring: [false, true]
+		},
+		valid: (v) => {
+			if (v.view === "phase-amplitude" && (v.boundaries || v.ring)) return false;
+			if (v.render === "symbol-path" && v.view === "phase-amplitude") return false;
+			return v.render === "points" || v.encoding === "single" && v.reference !== "error-vectors";
+		}
+	};
+	defaults() {
+		return {
+			i: "i",
+			q: "q",
+			modulation: "16qam",
+			render: "points",
+			reference: "lattice",
+			encoding: "single",
+			view: "i-q",
+			boundaries: true,
+			ring: false
+		};
+	}
+	symbols(ideal) {
+		return this.rows.map((row) => ({
+			i: this.num(row, this.options.i),
+			q: this.num(row, this.options.q)
+		})).filter((s) => Number.isFinite(s.i) && Number.isFinite(s.q)).map((s) => {
+			const near = ideal.reduce((best, p) => Math.hypot(p[0] - s.i, p[1] - s.q) < Math.hypot(best[0] - s.i, best[1] - s.q) ? p : best);
+			return {
+				...s,
+				ideal: near,
+				error: Math.hypot(near[0] - s.i, near[1] - s.q)
+			};
+		});
+	}
+	draw(ctx) {
+		const { modulation, render, reference, encoding, view, boundaries, ring, xLabel, yLabel } = this.options;
+		const { width, height } = ctx.plot;
+		const ideal = lattice(modulation);
+		const symbols = this.symbols(ideal);
+		const polar = view === "phase-amplitude";
+		const reach = Math.max(1.15, max(symbols, (s) => Math.max(Math.abs(s.i), Math.abs(s.q))) ?? 0) * 1.06;
+		const cartesian = this.equalScales(width, height, [-reach, reach], [-reach, reach]);
+		const radial = {
+			x: scaleLinear([-180, 180], [0, width]),
+			y: scaleLinear([0, Math.max(1.2, max(symbols, (s) => Math.hypot(s.i, s.q)) ?? 0) * 1.05], [height, 0])
+		};
+		const { x, y } = polar ? radial : cartesian;
+		const at = ([i, q]) => polar ? [x(Math.atan2(q, i) * 180 / Math.PI), y(Math.hypot(i, q))] : [x(i), y(q)];
+		this.frame(ctx, polar ? {
+			x,
+			y,
+			xValues: [
+				-180,
+				-90,
+				0,
+				90,
+				180
+			],
+			xFormat: (v) => `${v}°`,
+			xTitle: xLabel ?? "Phase",
+			yTitle: yLabel ?? "Amplitude"
+		} : {
+			x,
+			y,
+			xTitle: xLabel ?? "In-phase (I)",
+			yTitle: yLabel ?? "Quadrature (Q)"
+		});
+		if (boundaries && !polar) {
+			const cells = Delaunay.from(ideal.map(at)).voronoi([
+				0,
+				0,
+				width,
+				height
+			]);
+			this.guides(ctx, "boundaries", ideal.map((_, i) => ({
+				key: `v${i}`,
+				dash: "3 3",
+				points: cells.cellPolygon(i) ?? []
+			})));
+		}
+		if (ring && !polar) this.guides(ctx, "power-ring", [{
+			key: "ring",
+			dash: "4 3",
+			points: Array.from({ length: 121 }, (_, k) => at([Math.cos(k * Math.PI / 60), Math.sin(k * Math.PI / 60)]))
+		}]);
+		const worst = max(symbols, (s) => s.error) || 1e-9;
+		const seat = (s) => at([s.i, s.q]);
+		if (render === "density") {
+			const bands = contourDensity().x((s) => seat(s)[0]).y((s) => seat(s)[1]).size([width, height]).bandwidth(Math.max(3, width / 70)).thresholds(9)(symbols);
+			const top = Math.max(1e-9, ...bands.map((band) => band.value));
+			this.shapes(ctx, "density", bands.map((band, i) => ({
+				key: `d${i}`,
+				d: geoPath()(band) ?? "",
+				fill: ctx.palette.sequential(.12 + .88 * band.value / top)
+			})));
+		} else {
+			if (reference === "error-vectors") {
+				const vectors = symbols.flatMap((s) => {
+					const [a, b] = [seat(s), at(s.ideal)];
+					return Math.abs(a[0] - b[0]) > width / 3 ? [] : [
+						a,
+						b,
+						[NaN, NaN]
+					];
+				});
+				this.traces(ctx, "error-vectors", [{
+					key: "evm",
+					color: ctx.theme.inkMuted,
+					width: 1,
+					points: vectors
+				}]);
+			}
+			const shown = render === "symbol-path" ? symbols.slice(0, 64) : symbols;
+			if (render === "symbol-path") this.traces(ctx, "symbol-path", [{
+				key: "path",
+				color: ctx.palette.color("Symbols"),
+				width: 1,
+				points: shown.map(seat)
+			}]);
+			const quadrants = encoding === "by-quadrant";
+			if (quadrants) [
+				"Q1",
+				"Q2",
+				"Q3",
+				"Q4"
+			].forEach(ctx.palette.color);
+			const quadrant = (s) => s.i >= 0 ? s.q >= 0 ? 0 : 3 : s.q >= 0 ? 1 : 2;
+			const byError = encoding === "by-error";
+			const marks = ctx.marks("symbols", "path", shown).attr("fill-opacity", .75).attr("fill", (s) => {
+				if (byError) return ctx.palette.sequential(.2 + .8 * s.error / worst);
+				return ctx.palette.color(quadrants ? `Q${quadrant(s) + 1}` : "Symbols");
+			});
+			const glyph = (s) => symbol(Scales.symbol(quadrants ? QUADRANT_SYMBOLS[quadrant(s)] : SymbolKind.Circle), byError ? 5 + 42 * s.error / worst : 15)() ?? "";
+			const place = (s) => `translate(${seat(s)[0]},${seat(s)[1]})`;
+			ctx.set(marks, {
+				transform: place,
+				d: glyph
+			}, {
+				transform: place,
+				d: glyph
+			});
+			ctx.hover(marks, (s) => ({
+				title: "Symbol",
+				rows: [
+					["I", s.i.toFixed(3)],
+					["Q", s.q.toFixed(3)],
+					["Error", s.error.toFixed(3)]
+				]
+			}));
+		}
+		if (reference !== "unreferenced") {
+			const size = 4;
+			this.traces(ctx, "lattice", [{
+				key: "ideal",
+				color: ctx.theme.ink,
+				width: 1.5,
+				points: ideal.flatMap((p) => {
+					const [a, b] = at(p);
+					return [
+						[a - size, b],
+						[a + size, b],
+						[NaN, 0],
+						[a, b - size],
+						[a, b + size],
+						[NaN, 0]
+					];
+				})
+			}]);
+		}
+		const power = ideal.reduce((sum, p) => sum + p[0] ** 2 + p[1] ** 2, 0) / ideal.length;
+		const evm = symbols.length ? Math.sqrt(symbols.reduce((sum, s) => sum + s.error ** 2, 0) / symbols.length / power) * 100 : 0;
+		this.annotate(ctx, "evm-note", symbols.length ? [{
+			key: "e",
+			text: `EVM ${evm.toFixed(1)}%`,
+			x: width - 4,
+			y: 14,
+			anchor: "end",
+			tone: "ink"
+		}] : []);
+	}
+};
+export { ConstellationDiagram, ConstellationEncoding, ConstellationModulation, ConstellationReference, ConstellationRender, ConstellationView };

package/dist/charts/engineering/EngineeringChart.js

@@ -0,0 +1,296 @@
+import { Chart2D } from "../../core/Chart2D.js";
+import { curveLinear, format, group, line, max, min, scaleLinear } from "d3";
+// src/charts/engineering/EngineeringChart.ts
+var SI = format("~s");
+var PLAIN = format("~g");
+var CHAR = 6.2;
+/** Tick text in engineering shorthand: 2.4G, 10k, 0.05. */
+var engineeringTick = (value) => Math.abs(value) >= 1e4 ? SI(value) : PLAIN(+value.toPrecision(6));
+var isLog = (scale) => "base" in scale;
+var finite = (point) => Number.isFinite(point[0]) && Number.isFinite(point[1]);
+/** Major and minor ticks: decades plus 2..9 on log scales, d3's ticks elsewhere. */
+function ticksOf(scale, count) {
+	if (!isLog(scale)) return {
+		major: scale.ticks(count),
+		minor: []
+	};
+	const [low, high] = [Math.min(...scale.domain()), Math.max(...scale.domain())];
+	const first = Math.ceil(Math.log10(low) - 1e-9), last = Math.floor(Math.log10(high) + 1e-9);
+	if (last - first < 1) return {
+		major: scale.ticks(count),
+		minor: []
+	};
+	const step = Math.max(1, Math.ceil((last - first) / Math.max(1, count)));
+	const decades = Array.from({ length: last - first + 1 }, (_, i) => 10 ** (first + i));
+	const minor = last - first > 8 ? [] : Array.from({ length: last - first + 2 }, (_, i) => 10 ** (first - 1 + i)).flatMap((decade) => [
+		2,
+		3,
+		4,
+		5,
+		6,
+		7,
+		8,
+		9
+	].map((n) => decade * n)).filter((value) => value > low && value < high);
+	return {
+		major: decades.filter((_, i) => i % step === 0),
+		minor
+	};
+}
+/**
+* Shared base of the engineering module. Unlike `CartesianChart` it grids both axes, draws
+* log decades with minor lines, and can lay several axis pairs out in one chart.
+*/
+var EngineeringChart = class extends Chart2D {
+	plotMargin() {
+		return {
+			top: 10,
+			right: 18,
+			bottom: 44,
+			left: 58
+		};
+	}
+	get rows() {
+		return Array.isArray(this.options.data) ? this.options.data : [];
+	}
+	num(row, key) {
+		const value = key === void 0 ? null : row[key];
+		return value === null || value === void 0 || value === "" ? NaN : +value;
+	}
+	/** Rows by series, in first-seen order. A missing series column gives one group. */
+	series(key, rows = this.rows) {
+		return [...group(rows, (row) => String((key === void 0 ? null : row[key]) ?? "Series"))];
+	}
+	/** Data extent, safe for empty input, one value and log scales. */
+	span(values, { log = false, pad = 0, zero = false } = {}) {
+		const usable = values.filter((value) => Number.isFinite(value) && (!log || value > 0));
+		if (!usable.length) return log ? [1, 10] : [0, 1];
+		let low = min(usable), high = max(usable);
+		if (zero) {
+			low = Math.min(0, low);
+			high = Math.max(0, high);
+		}
+		if (low === high) return log ? [low / 2, high * 2] : [low - (Math.abs(low) || 1) / 2, high + (Math.abs(high) || 1) / 2];
+		if (log) return [low / 10 ** pad, high * 10 ** pad];
+		const margin = (high - low) * pad;
+		return [low - margin, high + margin];
+	}
+	/** Scales with the same units per pixel, for circles that must stay circles. */
+	equalScales(width, height, [x0, x1], [y0, y1]) {
+		const units = Math.max((x1 - x0) / width, (y1 - y0) / height);
+		const cx = (x0 + x1) / 2, cy = (y0 + y1) / 2;
+		return {
+			x: scaleLinear([cx - units * width / 2, cx + units * width / 2], [0, width]),
+			y: scaleLinear([cy - units * height / 2, cy + units * height / 2], [height, 0])
+		};
+	}
+	/** Grid, axes, tick text and titles for one axis pair, sized by the scales' ranges. */
+	frame(ctx, { x, y, name = "frame", xTitle, yTitle, xValues, yValues, xFormat = engineeringTick, yFormat = engineeringTick, hideX, hideY }) {
+		const width = Math.max(...x.range()), height = Math.max(...y.range());
+		const { theme } = ctx;
+		const layer = ctx.group(name).lower();
+		const tx = xValues ? {
+			major: xValues,
+			minor: []
+		} : ticksOf(x, Math.max(2, Math.floor(width / 70)));
+		const ty = yValues ? {
+			major: yValues,
+			minor: []
+		} : ticksOf(y, Math.max(2, Math.floor(height / 34)));
+		const vertical = (values, tier) => values.map((value) => ({
+			key: `x${tier}${value}`,
+			x1: x(value),
+			x2: x(value),
+			y1: 0,
+			y2: height,
+			tier
+		}));
+		const horizontal = (values, tier) => values.map((value) => ({
+			key: `y${tier}${value}`,
+			x1: 0,
+			x2: width,
+			y1: y(value),
+			y2: y(value),
+			tier
+		}));
+		const rules = this.options.grid === false ? [] : [
+			...vertical(tx.major, "a"),
+			...horizontal(ty.major, "a"),
+			...vertical(tx.minor, "b"),
+			...horizontal(ty.minor, "b")
+		];
+		ctx.marks("grid", "line", rules, (d) => d.key, layer).attr("x1", (d) => d.x1).attr("x2", (d) => d.x2).attr("y1", (d) => d.y1).attr("y2", (d) => d.y2).attr("stroke", theme.grid).attr("stroke-width", 1).attr("opacity", (d) => d.tier === "a" ? 1 : .55);
+		const zeros = [
+			...!isLog(x) && x.domain()[0] < 0 && x.domain()[1] > 0 ? [{
+				key: "x0",
+				x1: x(0),
+				x2: x(0),
+				y1: 0,
+				y2: height
+			}] : [],
+			...!isLog(y) && y.domain()[0] < 0 && y.domain()[1] > 0 ? [{
+				key: "y0",
+				x1: 0,
+				x2: width,
+				y1: y(0),
+				y2: y(0)
+			}] : [],
+			{
+				key: "base",
+				x1: 0,
+				x2: width,
+				y1: height,
+				y2: height
+			}
+		];
+		ctx.marks("axis-line", "line", zeros, (d) => d.key, layer).attr("x1", (d) => d.x1).attr("x2", (d) => d.x2).attr("y1", (d) => d.y1).attr("y2", (d) => d.y2).attr("stroke", theme.axis).attr("stroke-width", 1);
+		const placed = [];
+		if (!hideX) {
+			let edge = -Infinity;
+			for (const value of tx.major) {
+				const text = xFormat(value), half = text.length * CHAR / 2, at = x(value);
+				if (at - half < edge + 8 || at - half < -30 || at + half > width + 16) continue;
+				edge = at + half;
+				placed.push({
+					key: `lx${value}`,
+					text,
+					x: at,
+					y: height + 16,
+					anchor: "middle"
+				});
+			}
+		}
+		if (!hideY) {
+			let edge = Infinity;
+			for (const value of [...ty.major].sort((a, b) => y(b) - y(a) === 0 ? 0 : y(a) - y(b)).reverse()) {
+				const at = y(value);
+				if (edge - at < 13) continue;
+				edge = at;
+				placed.push({
+					key: `ly${value}`,
+					text: yFormat(value),
+					x: -8,
+					y: at + 3.5,
+					anchor: "end"
+				});
+			}
+		}
+		ctx.text(ctx.marks("tick-label", "text", placed, (d) => d.key, layer)).attr("x", (d) => d.x).attr("y", (d) => d.y).attr("text-anchor", (d) => d.anchor).text((d) => d.text);
+		const titles = [!hideX && xTitle ? {
+			key: "x",
+			text: xTitle,
+			transform: `translate(${width / 2},${height + 34})`
+		} : null, !hideY && yTitle ? {
+			key: "y",
+			text: this.fit(yTitle, height),
+			transform: `translate(-44,${height / 2}) rotate(-90)`
+		} : null].filter((title) => title !== null);
+		ctx.text(ctx.marks("axis-title", "text", titles, (d) => d.key, layer)).attr("text-anchor", "middle").attr("transform", (d) => d.transform).text((d) => d.text);
+	}
+	/** Secondary y axis on the right edge of a frame. */
+	rightAxis(ctx, y, width, title, label = engineeringTick) {
+		const height = Math.max(...y.range());
+		const ticks = y.ticks(Math.max(2, Math.floor(height / 34))).map((value) => ({
+			value,
+			text: label(value)
+		}));
+		ctx.text(ctx.marks("right-tick", "text", ticks, (d) => d.value)).attr("x", width + 8).attr("y", (d) => y(d.value) + 3.5).attr("text-anchor", "start").text((d) => d.text);
+		ctx.text(ctx.marks("right-title", "text", [title], (d) => d)).attr("text-anchor", "middle").attr("transform", `translate(${width + 44},${height / 2}) rotate(90)`).text(this.fit(title, height));
+	}
+	fit(text, room) {
+		const chars = Math.floor(room / CHAR);
+		return text.length <= chars ? text : `${text.slice(0, Math.max(1, chars - 1))}…`;
+	}
+	/** Data curves. Breaks at non-finite points, draws on, then morphs between renders. */
+	traces(ctx, name, list, parent) {
+		const path = line().defined(finite);
+		const geometry = (d) => path.curve(d.curve ?? curveLinear)(d.points) ?? "";
+		const marks = ctx.marks(name, "path", list, (d) => d.key, parent).attr("fill", "none").attr("stroke", (d) => d.color).attr("stroke-width", (d) => d.width ?? 2).attr("stroke-linejoin", "round").attr("stroke-linecap", "round").attr("stroke-dasharray", (d) => d.dash ?? null).attr("opacity", (d) => d.opacity ?? null);
+		ctx.drawOn(marks.filter(function() {
+			return !this.hasAttribute("d");
+		}).attr("d", geometry));
+		ctx.set(marks, { d: geometry });
+		return marks;
+	}
+	/** Recessive reference curves behind the data. */
+	guides(ctx, name, list, parent) {
+		const { axis } = ctx.theme;
+		this.traces(ctx, name, list.map((guide) => ({
+			...guide,
+			color: axis,
+			width: 1
+		})), parent);
+	}
+	/** Filled regions under the data, each a ready path. */
+	shapes(ctx, name, list, parent) {
+		const marks = ctx.marks(name, "path", list, (d) => d.key, parent).attr("fill", (d) => d.fill).attr("opacity", (d) => d.opacity ?? null).attr("stroke", "none");
+		ctx.set(marks, { d: (d) => d.d }, {
+			d: (d) => d.d,
+			opacity: 0
+		});
+		return marks;
+	}
+	/** Round markers with a surface ring. */
+	dots(ctx, name, items, at, fill, tip, radius = 4.5, parent) {
+		const shown = items.filter((item) => finite(at(item)));
+		const marks = ctx.marks(name, "circle", shown, void 0, parent).attr("fill", fill).attr("stroke", ctx.theme.surface).attr("stroke-width", 2);
+		ctx.set(marks, {
+			cx: (d) => at(d)[0],
+			cy: (d) => at(d)[1],
+			r: radius
+		}, {
+			cx: (d) => at(d)[0],
+			cy: (d) => at(d)[1],
+			r: 0
+		});
+		return ctx.hover(marks, tip);
+	}
+	/** Invisible hover targets along a curve, so tooltips can read off real values. */
+	probes(ctx, name, items, at, tip, parent) {
+		const shown = items.filter((item) => finite(at(item)));
+		const step = Math.max(1, Math.floor(shown.length / 60));
+		const marks = ctx.marks(name, "circle", shown.filter((_, i) => i % step === 0), void 0, parent).attr("fill", "transparent").attr("r", 8).attr("cx", (d) => at(d)[0]).attr("cy", (d) => at(d)[1]);
+		ctx.hover(marks, tip);
+	}
+	/** Halo-backed labels, kept inside `room` and dropped rather than overlapped. Earlier notes win. */
+	annotate(ctx, name, notes, room = ctx.plot, parent) {
+		const taken = [];
+		const kept = notes.flatMap((note) => {
+			if (!Number.isFinite(note.x) || !Number.isFinite(note.y)) return [];
+			const size = note.size ?? 11, wide = note.text.length * CHAR * (size / 11);
+			const anchor = note.anchor ?? "start";
+			const offset = anchor === "start" ? 0 : anchor === "middle" ? wide / 2 : wide;
+			const x = Math.max(offset, Math.min(room.width - wide + offset, note.x));
+			const y = Math.max(size, Math.min(room.height - 2, note.y));
+			const box = [
+				x - offset - 2,
+				y - size,
+				x - offset + wide + 2,
+				y + 3
+			];
+			if (taken.some((t) => box[0] < t[2] && box[2] > t[0] && box[1] < t[3] && box[3] > t[1])) return [];
+			taken.push(box);
+			return [{
+				...note,
+				x,
+				y,
+				anchor
+			}];
+		});
+		ctx.marks(name, "text", kept, (d) => d.key, parent).attr("x", (d) => d.x).attr("y", (d) => d.y).attr("text-anchor", (d) => d.anchor).attr("font-size", (d) => d.size ?? 11).attr("font-family", ctx.theme.fontFamily).attr("stroke", ctx.theme.surface).attr("stroke-width", 3).attr("paint-order", "stroke").attr("fill", (d) => ({
+			ink: ctx.theme.ink,
+			secondary: ctx.theme.inkSecondary,
+			muted: ctx.theme.inkMuted
+		})[d.tone ?? "secondary"]).text((d) => d.text);
+	}
+	/** Filled triangle pointing along `angle`, as a path. */
+	arrowhead([x, y], angle, size = 8) {
+		const corner = (turn, reach) => `${x + reach * Math.cos(angle + turn)},${y + reach * Math.sin(angle + turn)}`;
+		return `M${corner(0, size)}L${corner(2.5, size)}L${corner(-2.5, size)}Z`;
+	}
+	/** Keeps points inside the plot and turns the rest into line breaks. */
+	within(points, width, height) {
+		return points.map((point) => point[0] >= 0 && point[0] <= width && point[1] >= 0 && point[1] <= height ? point : [NaN, NaN]);
+	}
+};
+export { EngineeringChart, engineeringTick };