@mstone6969/graph 0.0.0-stage → 0.2.0

package/dist/charts/signals/ECGChart.js

@@ -0,0 +1,358 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { ZoomAxis } from "../../core/ChartViewport.js";
+import { SignalChart } from "./SignalChart.js";
+import { SignalSamples } from "./SignalSamples.js";
+import { SignalScales } from "./SignalScales.js";
+import { scaleBand, scaleLinear } from "d3";
+// src/charts/signals/ECGChart.ts
+var EcgView = /* @__PURE__ */ function(EcgView) {
+	EcgView["Trace"] = "trace";
+	EcgView["Tachogram"] = "rr-tachogram";
+	EcgView["Poincare"] = "poincare";
+	return EcgView;
+}({});
+var EcgLayout = /* @__PURE__ */ function(EcgLayout) {
+	EcgLayout["Strip"] = "rhythm-strip";
+	EcgLayout["Stacked"] = "stacked-leads";
+	EcgLayout["Grid"] = "lead-grid";
+	return EcgLayout;
+}({});
+var EcgAnnotation = /* @__PURE__ */ function(EcgAnnotation) {
+	EcgAnnotation["None"] = "none";
+	EcgAnnotation["Beats"] = "r-peaks";
+	EcgAnnotation["Intervals"] = "rr-intervals";
+	EcgAnnotation["Waves"] = "pqrst";
+	return EcgAnnotation;
+}({});
+var LEADS = [
+	["II", 1],
+	["I", .7],
+	["III", .45],
+	["aVR", -.8],
+	["aVL", .3],
+	["aVF", .75]
+];
+var WAVES = [
+	[
+		-.2,
+		.024,
+		.14
+	],
+	[
+		-.04,
+		.009,
+		-.14
+	],
+	[
+		0,
+		.011,
+		1.15
+	],
+	[
+		.04,
+		.011,
+		-.24
+	],
+	[
+		.26,
+		.05,
+		.3
+	]
+];
+var MINOR = .04;
+var RATE = 200;
+/** Electrocardiogram on calibrated paper, with rhythm analysis as tachogram and Poincaré plot. */
+var ECGChart = class extends SignalChart {
+	static meta = {
+		id: "signal-ecg",
+		name: "ECG",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Draws heart electrical activity on calibrated paper, with beat detection, RR tachogram and Poincaré views.",
+		tags: [
+			"ekg",
+			"electrocardiogram",
+			"heart rate variability",
+			"rhythm strip"
+		],
+		sample: (seed) => {
+			const [{ noise }] = SignalSamples.noise(seed, 2e3, 1), beats = [];
+			for (let at = .35, n = 0; at < 10; n++) {
+				beats.push(at);
+				at += .86 + .07 * Math.sin(n / 1.6) + noise[n] * .03;
+			}
+			return LEADS.flatMap(([series, gain], lead) => noise.map((step, i) => {
+				const t = i / RATE, near = beats.reduce((sum, beat) => sum + WAVES.reduce((part, [at, wide, tall]) => part + tall * Math.exp(-(((t - beat - at) / wide) ** 2) / 2), 0), 0);
+				return {
+					t: +t.toFixed(3),
+					series,
+					value: +(near * gain + .05 * Math.sin(2 * Math.PI * .25 * t + lead) + step * .006).toFixed(4)
+				};
+			}));
+		},
+		variants: {
+			view: Object.values(EcgView),
+			layout: Object.values(EcgLayout),
+			annotation: [
+				"r-peaks",
+				"none",
+				"rr-intervals",
+				"pqrst"
+			],
+			speed: [25, 50]
+		},
+		valid: (values) => {
+			if (values.view !== "trace") return values.layout === "rhythm-strip" && values.annotation === "r-peaks" && values.speed === 25;
+			return values.annotation !== "pqrst" || values.layout === "rhythm-strip";
+		}
+	};
+	constructor(options) {
+		const view = options.view ?? "trace";
+		const labels = view === "rr-tachogram" ? {
+			xLabel: "Beat",
+			yLabel: "RR interval (ms)"
+		} : view === "poincare" ? {
+			xLabel: "RRₙ (ms)",
+			yLabel: "RRₙ₊₁ (ms)"
+		} : {
+			xLabel: "Time (s)",
+			yLabel: (options.layout ?? "rhythm-strip") === "rhythm-strip" ? "mV" : void 0
+		};
+		super({
+			...labels,
+			...options
+		});
+	}
+	zoomAxes() {
+		return ZoomAxis.X;
+	}
+	defaults() {
+		return {
+			...super.defaults(),
+			view: "trace",
+			layout: "rhythm-strip",
+			annotation: "r-peaks",
+			speed: 25,
+			grid: false
+		};
+	}
+	get legended() {
+		return false;
+	}
+	get rhythm() {
+		return this.channels.find((channel) => channel.name === this.options.lead) ?? this.first;
+	}
+	/** R peaks by threshold with a 250 ms refractory period. */
+	get beats() {
+		const { t, v } = this.rhythm, bar = v.reduce((most, value) => Math.max(most, value), 0) * .6, out = [];
+		for (let i = 1; i < v.length - 1; i++) {
+			if (v[i] < bar || v[i] < v[i - 1] || v[i] <= v[i + 1]) continue;
+			const last = out[out.length - 1];
+			if (last && t[i] - last.t < .25) continue;
+			out.push({
+				index: i,
+				t: t[i],
+				rr: last ? (t[i] - last.t) * 1e3 : 0
+			});
+		}
+		return out;
+	}
+	get duration() {
+		const [lo, hi] = this.span;
+		return (hi - lo) * (25 / this.options.speed);
+	}
+	scales(ctx) {
+		const { width, height } = ctx.plot, { view, layout } = this.options, [lo] = this.span;
+		if (view === "rr-tachogram") {
+			const intervals = this.beats.filter((beat) => beat.rr);
+			const rr = intervals.map((beat) => beat.rr);
+			return {
+				x: scaleLinear([1, Math.max(2, intervals.length)], [0, width]),
+				y: scaleLinear([Math.min(...rr, 800) * .92, Math.max(...rr, 900) * 1.05], [height, 0]).nice(4)
+			};
+		}
+		if (view === "poincare") {
+			const rr = this.beats.filter((beat) => beat.rr).map((beat) => beat.rr), low = Math.min(...rr, 800) * .94, high = Math.max(...rr, 900) * 1.05;
+			return {
+				x: scaleLinear([low, high], [0, width]).nice(4),
+				y: scaleLinear([low, high], [height, 0]).nice(4)
+			};
+		}
+		const x = scaleLinear([lo, lo + this.duration], [0, width]), peak = this.peak * 1.18;
+		if (layout === "rhythm-strip") return {
+			x,
+			y: scaleLinear([-peak * .45, peak], [height, 0])
+		};
+		const hidden = scaleLinear([0, 1], [height, 0]);
+		return {
+			x,
+			y: SignalScales.labelled(hidden, [], () => "")
+		};
+	}
+	/** Paper: 1 mm and 5 mm boxes calibrated in time, drawn only when fine enough to read. */
+	paper(ctx, x, cell, name) {
+		const [lo, hi] = x.domain(), step = x(lo + MINOR) - x(lo);
+		const count = Math.floor((hi - lo) / MINOR), lines = Array.from({ length: count + 1 }, (_, i) => i);
+		const major = (i) => i % 5 === 0, fine = step >= 3;
+		const shown = lines.filter((i) => major(i) || fine).map((i) => ({
+			i,
+			at: cell.left + (x(lo + i * MINOR) - x(lo)) * (cell.width / ctx.plot.width)
+		}));
+		ctx.marks(`paper-${name}`, "line", shown, (line) => line.i).attr("x1", (line) => line.at).attr("x2", (line) => line.at).attr("y1", cell.top).attr("y2", cell.top + cell.height).attr("stroke", (line) => major(line.i) ? ctx.theme.axis : ctx.theme.grid).attr("stroke-opacity", (line) => major(line.i) ? .6 : .7);
+		const box = 5 * Math.abs(step) * (cell.width / ctx.plot.width), rows = Math.ceil(cell.height / box);
+		ctx.marks(`paper-rows-${name}`, "line", Array.from({ length: rows + 1 }, (_, i) => i), (i) => i).attr("x1", cell.left).attr("x2", cell.left + cell.width).attr("y1", (i) => cell.top + cell.height - i * box).attr("y2", (i) => cell.top + cell.height - i * box).attr("stroke", ctx.theme.axis).attr("stroke-opacity", .6);
+	}
+	cells(ctx) {
+		const { width, height } = ctx.plot, { layout } = this.options, list = this.channels;
+		if (layout === "rhythm-strip") return list.length ? [{
+			channel: this.rhythm,
+			left: 0,
+			top: 0,
+			width,
+			height
+		}] : [];
+		if (layout === "stacked-leads") {
+			const shown = list.slice(0, Math.max(1, Math.floor(height / 26)));
+			const band = scaleBand(shown.map((channel) => channel.name), [0, height]).paddingInner(.06);
+			return shown.map((channel) => ({
+				channel,
+				left: 0,
+				top: band(channel.name),
+				width,
+				height: band.bandwidth()
+			}));
+		}
+		const columns = Math.min(2, list.length || 1), rows = Math.ceil(list.length / columns), gap = 8;
+		const wide = (width - gap * (columns - 1)) / columns, tall = (height - gap * (rows - 1)) / rows;
+		return list.map((channel, i) => ({
+			channel,
+			left: i % columns * (wide + gap),
+			top: Math.floor(i / columns) * (tall + gap),
+			width: wide,
+			height: tall
+		}));
+	}
+	plotMarks(ctx, { x, y }) {
+		const { view } = this.options;
+		if (view === "rr-tachogram") return this.tachogram(ctx, x, y);
+		if (view === "poincare") return this.poincare(ctx, x, y);
+		const peak = this.peak * 1.18, cells = this.cells(ctx), color = ctx.palette.color(this.rhythm.name), [lo, hi] = x.domain();
+		const rendered = cells.map((cell, i) => {
+			this.paper(ctx, x, cell, `${i}`);
+			const local = scaleLinear([-peak * .45, peak], [cell.top + cell.height, cell.top]);
+			const across = scaleLinear([lo, hi], [cell.left, cell.left + cell.width]);
+			const keep = cell.channel.t.map((t, n) => [t, cell.channel.v[n]]).filter(([t]) => t <= hi);
+			const stride = Math.max(1, Math.floor(keep.length / (cell.width / .8)));
+			const peaks = keep.filter((point, n) => n % stride === 0 || Math.abs(point[1]) > peak * .4);
+			return {
+				key: cell.channel.name,
+				cell,
+				d: this.path(peaks, across, local),
+				local,
+				across
+			};
+		});
+		this.stroke(ctx, "ecg", rendered, (item) => item.key, (item) => item.d, () => color, 1.5);
+		if (cells.length > 1) this.halo(ctx, ctx.text(ctx.marks("leads", "text", rendered, (item) => item.key).attr("x", (item) => item.cell.left + 4).attr("y", (item) => item.cell.top + item.cell.height - 3).text((item) => item.key), 11, "ink"));
+		if (rendered[0]) this.annotate(ctx, rendered[0].across, rendered[0].local, hi);
+		this.probe(ctx, (px, py) => {
+			const item = rendered.find(({ cell }) => px >= cell.left && px <= cell.left + cell.width && py >= cell.top && py <= cell.top + cell.height);
+			if (!item) return null;
+			const time = item.across.invert(px), nearest = item.cell.channel.t.reduce((best, t, i) => Math.abs(t - time) < Math.abs(item.cell.channel.t[best] - time) ? i : best, 0);
+			return {
+				x: px,
+				tip: {
+					title: `Lead ${item.key}`,
+					rows: [["Time", `${SignalScales.number(time)} s`], ["mV", SignalScales.number(item.cell.channel.v[nearest])]]
+				},
+				datum: {
+					lead: item.key,
+					t: time
+				}
+			};
+		});
+	}
+	annotate(ctx, x, y, end) {
+		const { annotation, layout } = this.options, { v } = this.rhythm, stack = layout !== "rhythm-strip";
+		const beats = this.beats.filter((beat) => beat.t <= end);
+		if (annotation === "none" || !beats.length) return;
+		if (annotation === "r-peaks") {
+			const dots = ctx.marks("r-peaks", "circle", beats, (beat) => beat.index).attr("fill", ctx.theme.ink).attr("stroke", ctx.theme.surface).attr("stroke-width", 2);
+			ctx.set(dots, {
+				cx: (beat) => x(beat.t),
+				cy: (beat) => y(v[beat.index]),
+				r: 4
+			}, { r: 0 }, 30);
+			ctx.hover(dots, (beat) => ({
+				title: `R peak ${SignalScales.number(beat.t)} s`,
+				rows: beat.rr ? [["RR", `${Math.round(beat.rr)} ms`], ["Rate", `${Math.round(6e4 / beat.rr)} bpm`]] : []
+			}));
+		}
+		if (annotation === "rr-intervals") {
+			const spans = beats.slice(1).filter((_, i) => i % Math.max(1, Math.ceil(beats.length / Math.max(1, x.range()[1] / 54))) === 0);
+			const at = y.range()[1] + (stack ? 6 : 9);
+			const paths = ctx.marks("rr", "path", spans, (beat) => beat.index).attr("fill", "none").attr("stroke", ctx.theme.inkSecondary).attr("d", (beat) => `M${x(beat.t - beat.rr / 1e3)} ${at + 3}V${at}H${x(beat.t)}V${at + 3}`);
+			ctx.hover(paths, (beat) => ({
+				title: "RR interval",
+				rows: [["Duration", `${Math.round(beat.rr)} ms`]]
+			}));
+			this.halo(ctx, ctx.text(ctx.marks("rr-text", "text", spans, (beat) => beat.index).attr("x", (beat) => x(beat.t - beat.rr / 2e3)).attr("y", at + 13).attr("text-anchor", "middle").text((beat) => `${Math.round(beat.rr)}`), 10, "secondary"));
+		}
+		if (annotation === "pqrst") {
+			const beat = beats[Math.min(1, beats.length - 1)];
+			const tags = [
+				["P", -.2],
+				["Q", -.04],
+				["R", 0],
+				["S", .04],
+				["T", .26]
+			].map(([name, at]) => {
+				const index = Math.max(0, Math.min(v.length - 1, beat.index + Math.round(at * this.rhythm.rate)));
+				const below = name === "Q" || name === "S";
+				return {
+					name,
+					x: x(this.rhythm.t[index]) + (name === "Q" ? -5 : name === "S" ? 5 : 0),
+					y: Math.max(11, y(v[index]) + (below ? 13 : -6))
+				};
+			});
+			ctx.text(ctx.marks("waves", "text", tags, (tag) => tag.name).attr("x", (tag) => tag.x).attr("y", (tag) => tag.y).attr("text-anchor", "middle").text((tag) => tag.name), 11, "ink");
+		}
+	}
+	tachogram(ctx, x, y) {
+		const beats = this.beats.filter((beat) => beat.rr), color = ctx.palette.color(this.rhythm.name);
+		this.stroke(ctx, "rr-line", [beats], () => 0, (list) => this.path(list.map((beat, i) => [i + 1, beat.rr]), x, y), () => color);
+		const dots = ctx.marks("rr-dots", "circle", beats, (beat) => beat.index).attr("fill", color).attr("stroke", ctx.theme.surface).attr("stroke-width", 2);
+		ctx.set(dots, {
+			cx: (_, i) => x(i + 1),
+			cy: (beat) => y(beat.rr),
+			r: 4
+		}, { r: 0 }, 20);
+		ctx.hover(dots, (beat, i) => ({
+			title: `Beat ${i + 1}`,
+			color,
+			rows: [["RR", `${Math.round(beat.rr)} ms`], ["Rate", `${Math.round(6e4 / beat.rr)} bpm`]]
+		}));
+	}
+	poincare(ctx, x, y) {
+		const rr = this.beats.filter((beat) => beat.rr).map((beat) => beat.rr), color = ctx.palette.color(this.rhythm.name);
+		const pairs = rr.slice(1).map((value, i) => ({
+			a: rr[i],
+			b: value,
+			key: i
+		})), [lo, hi] = x.domain();
+		ctx.marks("identity", "line", [0]).attr("x1", x(lo)).attr("y1", y(lo)).attr("x2", x(hi)).attr("y2", y(hi)).attr("stroke", ctx.theme.axis).attr("stroke-dasharray", "4 3");
+		const dots = ctx.marks("pairs", "circle", pairs, (pair) => pair.key).attr("fill", color).attr("stroke", ctx.theme.surface).attr("stroke-width", 2);
+		ctx.set(dots, {
+			cx: (pair) => x(pair.a),
+			cy: (pair) => y(pair.b),
+			r: 4.5
+		}, { r: 0 }, 20);
+		ctx.hover(dots, (pair) => ({
+			title: "Successive beats",
+			color,
+			rows: [["RRₙ", `${Math.round(pair.a)} ms`], ["RRₙ₊₁", `${Math.round(pair.b)} ms`]]
+		}));
+	}
+};
+export { ECGChart, EcgAnnotation, EcgLayout, EcgView };

package/dist/charts/signals/EnvelopeChart.js

@@ -0,0 +1,137 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SignalChart } from "./SignalChart.js";
+import { SignalDsp } from "./SignalDsp.js";
+import { SignalAmplitude } from "./SignalEnums.js";
+import { SignalSamples } from "./SignalSamples.js";
+import { SignalScales } from "./SignalScales.js";
+import { area, scaleLinear } from "d3";
+// src/charts/signals/EnvelopeChart.ts
+var EnvelopeMethod = /* @__PURE__ */ function(EnvelopeMethod) {
+	EnvelopeMethod["Hilbert"] = "hilbert";
+	EnvelopeMethod["Smoothed"] = "smoothed-hilbert";
+	EnvelopeMethod["Rms"] = "rms";
+	EnvelopeMethod["Follower"] = "peak-follower";
+	return EnvelopeMethod;
+}({});
+var EnvelopeShape = /* @__PURE__ */ function(EnvelopeShape) {
+	EnvelopeShape["Mirrored"] = "mirrored";
+	EnvelopeShape["Upper"] = "upper";
+	return EnvelopeShape;
+}({});
+var FLOOR = -60;
+/** Extracts the slow amplitude shape of an oscillating signal, for loudness, modulation and decay analysis. */
+var EnvelopeChart = class extends SignalChart {
+	static meta = {
+		id: "signal-envelope",
+		name: "Signal envelope",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Traces the slowly varying amplitude around a fast signal, by Hilbert transform, RMS or peak follower.",
+		tags: [
+			"hilbert",
+			"amplitude modulation",
+			"rms",
+			"decay"
+		],
+		sample: (seed) => SignalSamples.notes(seed, 2048, 1),
+		variants: {
+			method: Object.values(EnvelopeMethod),
+			shape: Object.values(EnvelopeShape),
+			amplitude: [SignalAmplitude.Linear, SignalAmplitude.Decibel],
+			carrier: [true, false],
+			decay: [false, true]
+		},
+		valid: (values) => values.amplitude === SignalAmplitude.Linear || values.shape === "upper" && values.carrier === false
+	};
+	constructor(options) {
+		super({
+			yLabel: options.amplitude === SignalAmplitude.Decibel ? "Level (dB)" : "Amplitude",
+			...options
+		});
+	}
+	defaults() {
+		return {
+			...super.defaults(),
+			method: "hilbert",
+			shape: "mirrored",
+			amplitude: SignalAmplitude.Linear,
+			carrier: true,
+			decay: false,
+			smoothing: .008
+		};
+	}
+	get decibel() {
+		return this.options.amplitude === SignalAmplitude.Decibel;
+	}
+	get mirrored() {
+		return this.options.shape === "mirrored";
+	}
+	envelope(values, rate) {
+		const { method, smoothing } = this.options, span = smoothing * rate;
+		switch (method) {
+			case "rms": return SignalDsp.rms(values, span).map((value) => value * Math.SQRT2);
+			case "peak-follower": return SignalDsp.follow(values, Math.exp(-1 / (.03 * rate)));
+			case "smoothed-hilbert": return SignalDsp.smooth(SignalDsp.hilbert(values).envelope, span);
+			default: return SignalDsp.hilbert(values).envelope;
+		}
+	}
+	scales(ctx) {
+		const { width, height } = ctx.plot, peak = this.peak, x = scaleLinear(this.span, [0, width]);
+		if (this.decibel) return {
+			x,
+			y: scaleLinear([FLOOR, 3], [height, 0])
+		};
+		return {
+			x,
+			y: scaleLinear([this.mirrored ? -peak * 1.08 : 0, peak * 1.08], [height, 0]).nice(4)
+		};
+	}
+	plotMarks(ctx, { x, y }) {
+		const { carrier, decay } = this.options, { width } = ctx.plot, peak = this.peak;
+		const level = (value) => this.decibel ? SignalDsp.decibel(value, peak, FLOOR) : value;
+		const traces = this.channels.map((channel) => {
+			const color = ctx.palette.color(channel.name), envelope = this.envelope(channel.v, channel.rate);
+			return {
+				channel,
+				color,
+				envelope,
+				coarse: SignalDsp.buckets(channel.t, envelope, width / 2).map((bucket) => [bucket.t, level(bucket.max)])
+			};
+		});
+		if (carrier) this.fill(ctx, "carrier", traces, (trace) => trace.channel.name, (trace) => this.carrier(trace.channel.t, trace.channel.v, width, x, y), (trace) => trace.color, .25);
+		else if (this.mirrored || !this.decibel) {
+			const low = this.mirrored ? (v) => y(-v) : () => y(0);
+			const shape = area().x((point) => x(point[0])).y0((point) => low(point[1])).y1((point) => y(point[1]));
+			this.fill(ctx, "body", traces, (trace) => trace.channel.name, (trace) => shape(trace.coarse) ?? "", (trace) => trace.color, .25);
+		}
+		this.stroke(ctx, "upper", traces, (trace) => trace.channel.name, (trace) => this.path(trace.coarse, x, y), (trace) => trace.color);
+		if (this.mirrored) this.stroke(ctx, "lower", traces, (trace) => trace.channel.name, (trace) => this.path(trace.coarse.map(([t, value]) => [t, -value]), x, y), (trace) => trace.color);
+		if (decay && traces[0]) this.decay(ctx, traces[0].channel.t, traces[0].envelope, x, y, level);
+		this.timeProbe(ctx, x);
+	}
+	carrier(t, v, width, x, y) {
+		const reach = (b) => this.mirrored ? b.max : Math.max(Math.abs(b.min), Math.abs(b.max));
+		return area().x((b) => x(b.t)).y0((b) => y(this.mirrored ? b.min : 0)).y1((b) => y(reach(b)))(SignalDsp.buckets(t, v, width / 1.5)) ?? "";
+	}
+	decay(ctx, t, envelope, x, y, level) {
+		const top = envelope.indexOf(Math.max(...envelope));
+		const after = envelope.findIndex((value, i) => i > top && value < envelope[top] * .1);
+		if (top < 0) return;
+		const marks = [top, after].filter((index) => index >= 0).map((index) => ({
+			index,
+			at: x(t[index]),
+			height: y(level(envelope[index]))
+		}));
+		const dots = ctx.marks("decay", "circle", marks, (mark) => mark.index).attr("fill", ctx.theme.ink).attr("stroke", ctx.theme.surface).attr("stroke-width", 2);
+		ctx.set(dots, {
+			cx: (mark) => mark.at,
+			cy: (mark) => mark.height,
+			r: 4
+		}, { r: 0 });
+		if (after < 0) return;
+		const span = marks[1].at - marks[0].at, flip = marks[1].at > ctx.plot.width - 90;
+		if (span > 0) ctx.text(ctx.marks("decay-text", "text", [0]).attr("x", marks[1].at + (flip ? -8 : 8)).attr("y", Math.max(12, marks[1].height - 8)).attr("text-anchor", flip ? "end" : "start").text(`−20 dB in ${SignalScales.number(t[after] - t[top])} s`), 11, "ink");
+	}
+};
+export { EnvelopeChart, EnvelopeMethod, EnvelopeShape };