@mstone6969/graph 0.0.0-stage → 0.2.0

package/dist/charts/signals/WaterfallSpectrum.js

@@ -0,0 +1,131 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SignalDsp } from "./SignalDsp.js";
+import { SignalFrequencyScale, SignalWindow } from "./SignalEnums.js";
+import { SignalSamples } from "./SignalSamples.js";
+import { SignalScales } from "./SignalScales.js";
+import { SpectralChart } from "./SpectralChart.js";
+import { area, max, scaleLinear } from "d3";
+// src/charts/signals/WaterfallSpectrum.ts
+var WaterfallFill = /* @__PURE__ */ function(WaterfallFill) {
+	WaterfallFill["Hidden"] = "hidden-line";
+	WaterfallFill["Magnitude"] = "magnitude";
+	WaterfallFill["Lines"] = "lines";
+	return WaterfallFill;
+}({});
+var WaterfallProjection = /* @__PURE__ */ function(WaterfallProjection) {
+	WaterfallProjection["Straight"] = "straight";
+	WaterfallProjection["Oblique"] = "oblique";
+	return WaterfallProjection;
+}({});
+var WaterfallOrder = /* @__PURE__ */ function(WaterfallOrder) {
+	WaterfallOrder["NewestFront"] = "newest-front";
+	WaterfallOrder["NewestBack"] = "newest-back";
+	return WaterfallOrder;
+}({});
+var SHEAR = .16;
+/** Stacks successive spectra front to back, the classic cumulative-decay and transient view. */
+var WaterfallSpectrum = class extends SpectralChart {
+	static meta = {
+		id: "signal-waterfall-spectrum",
+		name: "Waterfall spectrum",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Stacks successive spectra as overlapping ridges to show how spectral peaks rise and decay.",
+		tags: [
+			"cumulative spectral decay",
+			"ridgeline",
+			"stft",
+			"joy plot"
+		],
+		sample: (seed) => SignalSamples.chirp(seed),
+		variants: {
+			fill: ["hidden-line", "lines"],
+			projection: Object.values(WaterfallProjection),
+			order: Object.values(WaterfallOrder),
+			frequency: [SignalFrequencyScale.Linear, SignalFrequencyScale.Log],
+			overlap: [2.5, 5]
+		}
+	};
+	defaults() {
+		return {
+			...super.defaults(),
+			yLabel: "Time (s)",
+			fill: "hidden-line",
+			projection: "straight",
+			order: "newest-front",
+			overlap: 2.5,
+			frames: 14,
+			frameSize: 512,
+			range: 50
+		};
+	}
+	get legended() {
+		return false;
+	}
+	get spectra() {
+		const { channel, frames, frameSize } = this.options, picked = this.channels.find((item) => item.name === channel) ?? this.first;
+		return SignalDsp.stft(picked.v, picked.rate, SignalWindow.Hann, frameSize, frames, picked.t[0] ?? 0);
+	}
+	get oblique() {
+		return this.options.projection === "oblique";
+	}
+	scales(ctx) {
+		const { times, freqs } = this.spectra, { width, height } = ctx.plot, { frames, overlap, order } = this.options;
+		const lift = height / (frames + overlap), run = this.oblique ? width * SHEAR : 0;
+		const span = [times[0] ?? 0, times[times.length - 1] ?? 1];
+		const range = order === "newest-back" ? [height, lift * overlap] : [lift * overlap, height];
+		return {
+			x: this.frequencyAxis(freqs, width - run),
+			y: scaleLinear(span, range).nice(4).clamp(true)
+		};
+	}
+	ridges({ x, y }, run) {
+		const { times, freqs, mags } = this.spectra, { range, order } = this.options, floor = x.domain()[0];
+		const top = max(mags, (frame) => max(frame)) ?? 1;
+		const count = times.length;
+		return times.map((time, f) => {
+			const depth = (order === "newest-back" ? f : count - 1 - f) / Math.max(1, count - 1);
+			const points = freqs.flatMap((freq, bin) => freq < floor ? [] : [[freq, Math.max(0, 1 + SignalDsp.decibel(mags[f][bin], top, -range) / range)]]);
+			return {
+				key: f,
+				time,
+				position: y(time),
+				shift: run * depth,
+				points,
+				peak: max(points, (point) => point[1]) ?? 0
+			};
+		}).sort((a, b) => a.position - b.position);
+	}
+	plotMarks(ctx, axes) {
+		const { x } = axes, { fill, overlap, frames } = this.options, { width, height } = ctx.plot;
+		const lift = height / (frames + overlap), run = this.oblique ? width * SHEAR : 0, tall = lift * overlap;
+		const ridges = this.ridges(axes, run);
+		const color = ctx.palette.color(this.first.name);
+		const shape = (ridge) => area().x((point) => x(point[0]) + ridge.shift).y0(ridge.position).y1((point) => ridge.position - point[1] * tall)(ridge.points) ?? "";
+		const crest = (ridge) => this.path(ridge.points, (freq) => x(freq) + ridge.shift, (level) => ridge.position - level * tall);
+		const tint = (ridge) => fill === "magnitude" ? ctx.palette.sequential(.15 + ridge.peak * .8) : ctx.theme.surface;
+		if (fill !== "lines") for (const [i, ridge] of ridges.entries()) {
+			this.fill(ctx, `sheet-${i}`, [ridge], (item) => item.key, shape, tint);
+			this.stroke(ctx, `crest-${i}`, [ridge], (item) => item.key, crest, () => fill === "magnitude" ? ctx.theme.surface : color, 1.5);
+		}
+		else this.stroke(ctx, "crest", ridges, (ridge) => ridge.key, crest, () => color, 1.5);
+		this.probe(ctx, (px, py) => {
+			const ridge = ridges.reduce((best, item) => !best || Math.abs(item.position - py) < Math.abs(best.position - py) ? item : best, null);
+			if (!ridge) return null;
+			const freq = x.invert(px - ridge.shift);
+			return {
+				x: px,
+				tip: {
+					title: `${SignalScales.number(ridge.time)} s`,
+					rows: [["Frequency", `${SignalScales.hertz(freq)} Hz`], ["Peak", SignalScales.number(ridge.peak)]]
+				},
+				datum: {
+					t: ridge.time,
+					frequency: freq
+				}
+			};
+		});
+	}
+};
+export { WaterfallFill, WaterfallOrder, WaterfallProjection, WaterfallSpectrum };

package/dist/charts/signals/WaterfallSurface3DChart.js

@@ -0,0 +1,220 @@
+import { Chart3D } from "../../core/Chart3D.js";
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SignalParser } from "./SignalChart.js";
+import { SignalDsp } from "./SignalDsp.js";
+import { SignalAmplitude, SignalFrequencyScale, SignalWindow } from "./SignalEnums.js";
+import { SignalSamples } from "./SignalSamples.js";
+import { SignalScales } from "./SignalScales.js";
+import { max, scaleLinear, scaleLog } from "d3";
+import { BoxGeometry, BufferGeometry, Color, DoubleSide, Float32BufferAttribute, InstancedMesh, LineBasicMaterial, LineSegments, Mesh, MeshStandardMaterial, Object3D, PlaneGeometry } from "three";
+// src/charts/signals/WaterfallSurface3DChart.ts
+var SurfaceSpectrumStyle = /* @__PURE__ */ function(SurfaceSpectrumStyle) {
+	SurfaceSpectrumStyle["Surface"] = "surface";
+	SurfaceSpectrumStyle["Ribbons"] = "ribbons";
+	SurfaceSpectrumStyle["Wire"] = "wire";
+	SurfaceSpectrumStyle["Bars"] = "bars";
+	return SurfaceSpectrumStyle;
+}({});
+var HEIGHT = 1.3;
+var BASE = -.72;
+/** A spectrogram lifted into relief: time runs along z, frequency along x, level upward. */
+var WaterfallSurface3DChart = class extends Chart3D {
+	static meta = {
+		id: "signal-waterfall-3d",
+		name: "3D waterfall spectrum",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Three,
+		shape: DataShape.Table,
+		description: "Lifts a spectrogram into a 3D landscape of time, frequency and level, for sweeps and decaying modes.",
+		tags: [
+			"surface",
+			"stft",
+			"landscape",
+			"ridges"
+		],
+		sample: (seed) => SignalSamples.chirp(seed),
+		variants: {
+			style: Object.values(SurfaceSpectrumStyle),
+			frequency: [SignalFrequencyScale.Linear, SignalFrequencyScale.Log],
+			amplitude: Object.values(SignalAmplitude),
+			floor: [true, false]
+		}
+	};
+	defaults() {
+		return {
+			x: "t",
+			y: "value",
+			series: "series",
+			style: "surface",
+			frequency: SignalFrequencyScale.Linear,
+			amplitude: SignalAmplitude.Decibel,
+			floor: true,
+			frames: 56,
+			bins: 72,
+			frameSize: 512,
+			azimuth: 42,
+			elevation: 30,
+			distance: 5
+		};
+	}
+	/** `levels[frame][bin]` in 0..1 on a uniform grid over the chosen frequency scale. */
+	grid() {
+		const { data, x, y, series, sampleRate, channel, frames, bins, frameSize, frequency, amplitude } = this.options;
+		const list = SignalParser.channels(data, x, y, series, sampleRate), picked = list.find((item) => item.name === channel) ?? list[0];
+		const stft = picked ? SignalDsp.stft(picked.v, picked.rate, SignalWindow.Hann, frameSize, frames, picked.t[0] ?? 0) : null;
+		if (!stft?.mags.length) return null;
+		const top = max(stft.mags, (frame) => max(frame)) ?? 1, { freqs, times, mags } = stft, step = freqs[0], hi = freqs[freqs.length - 1];
+		const place = frequency === SignalFrequencyScale.Log ? scaleLog([step * 2, hi], [0, 1]) : scaleLinear([step, hi], [0, 1]);
+		const axis = Array.from({ length: bins }, (_, i) => place.invert(i / (bins - 1)));
+		return {
+			levels: mags.map((frame) => axis.map((freq) => {
+				const value = frame[Math.max(0, Math.min(frame.length - 1, Math.round(freq / step) - 1))];
+				return amplitude === SignalAmplitude.Decibel ? Math.max(0, 1 + SignalDsp.decibel(value, top, -60) / 60) : Math.sqrt(value / top);
+			})),
+			axis,
+			times
+		};
+	}
+	surface(levels, ctx, height) {
+		const rows = levels.length, columns = levels[0].length, position = [], color = [], index = [];
+		const shade = new Color();
+		levels.forEach((row, f) => row.forEach((level, b) => {
+			position.push(b / (columns - 1) * 2 - 1, BASE + level * height, 1 - f / Math.max(1, rows - 1) * 2);
+			shade.set(ctx.palette.sequential(.12 + level * .88));
+			color.push(shade.r, shade.g, shade.b);
+			if (f < rows - 1 && b < columns - 1) {
+				const a = f * columns + b, c = a + columns;
+				index.push(a, a + 1, c, a + 1, c + 1, c);
+			}
+		}));
+		const geometry = new BufferGeometry();
+		geometry.setAttribute("position", new Float32BufferAttribute(position, 3));
+		geometry.setAttribute("color", new Float32BufferAttribute(color, 3));
+		geometry.setIndex(index);
+		geometry.computeVertexNormals();
+		return geometry;
+	}
+	rise(ctx, group) {
+		group.position.y = BASE;
+		ctx.reveal((progress) => {
+			group.scale.y = Math.max(.001, progress);
+			group.position.y = BASE * (1 - Math.max(.001, progress));
+		});
+	}
+	build(ctx) {
+		const grid = this.grid(), { style, floor } = this.options;
+		const plane = new Mesh(new PlaneGeometry(2.1, 2.1), new MeshStandardMaterial({ color: ctx.theme.grid }));
+		plane.rotation.x = -Math.PI / 2;
+		plane.position.y = -.73;
+		plane.receiveShadow = true;
+		ctx.root.add(plane);
+		if (!grid) return;
+		const { levels, axis, times } = grid, frames = levels.length, bins = axis.length;
+		if (style === "bars") this.bars(ctx, levels, axis, times);
+		if (style === "surface") {
+			const mesh = new Mesh(this.surface(levels, ctx, HEIGHT), new MeshStandardMaterial({
+				vertexColors: true,
+				roughness: .6,
+				side: DoubleSide
+			}));
+			mesh.castShadow = true;
+			this.rise(ctx, mesh);
+			ctx.root.add(mesh);
+			ctx.pick(mesh, () => ({
+				title: "Spectrum over time",
+				rows: [["Frames", frames], ["Bins", bins]]
+			}));
+		}
+		if (style === "ribbons") levels.filter((_, f) => f % 4 === 0).forEach((row, i, rows) => {
+			const strip = [row, row.map((level) => level * 0)];
+			const mesh = new Mesh(this.surface(strip, ctx, HEIGHT), new MeshStandardMaterial({
+				vertexColors: true,
+				roughness: .55,
+				side: DoubleSide
+			}));
+			mesh.geometry.scale(1, 1, .012);
+			mesh.position.z = 1 - i / Math.max(1, rows.length - 1) * 2;
+			mesh.castShadow = true;
+			this.rise(ctx, mesh);
+			mesh.position.z = 1 - i / Math.max(1, rows.length - 1) * 2;
+			ctx.root.add(mesh);
+			ctx.pick(mesh, () => ({
+				title: `${SignalScales.number(times[i * 4])} s`,
+				rows: [["Peak", SignalScales.number(Math.max(...row))]]
+			}));
+		});
+		if (style === "wire") {
+			const position = [], place = (f, b) => [
+				b / (bins - 1) * 2 - 1,
+				BASE + levels[f][b] * HEIGHT,
+				1 - f / (frames - 1) * 2
+			];
+			for (let f = 0; f < frames; f += 3) for (let b = 0; b < bins - 1; b++) position.push(...place(f, b), ...place(f, b + 1));
+			for (let b = 0; b < bins; b += 3) for (let f = 0; f < frames - 3; f += 3) position.push(...place(f, b), ...place(f + 3, b));
+			const geometry = new BufferGeometry().setAttribute("position", new Float32BufferAttribute(position, 3));
+			const wire = new LineSegments(geometry, new LineBasicMaterial({ color: ctx.palette.sequential(.75) }));
+			this.rise(ctx, wire);
+			ctx.root.add(wire);
+		}
+		if (floor) {
+			const heat = new Mesh(this.surface(levels, ctx, 0), new MeshStandardMaterial({
+				vertexColors: true,
+				roughness: .9,
+				side: DoubleSide
+			}));
+			heat.position.y = .002;
+			heat.receiveShadow = true;
+			ctx.root.add(heat);
+		}
+		const hz = (i) => SignalScales.hertz(axis[i]);
+		ctx.label(hz(0), [
+			-1,
+			-.77,
+			1.18
+		], "muted", 10);
+		ctx.label(`${hz(bins - 1)} Hz`, [
+			1,
+			-.77,
+			1.18
+		], "muted", 10);
+		ctx.label(`${SignalScales.number(times[0])} s`, [
+			1.2,
+			-.77,
+			1
+		], "muted", 10);
+		ctx.label(`${SignalScales.number(times[frames - 1])} s`, [
+			1.2,
+			-.77,
+			-1
+		], "muted", 10);
+	}
+	bars(ctx, levels, axis, times) {
+		const stepF = Math.max(1, Math.floor(levels.length / 22)), stepB = Math.max(1, Math.floor(axis.length / 28));
+		const cells = levels.flatMap((row, f) => f % stepF ? [] : row.flatMap((level, b) => b % stepB ? [] : [{
+			f,
+			b,
+			level
+		}]));
+		const wide = 2 / (axis.length / stepB) * .8, deep = 2 / (levels.length / stepF) * .8;
+		const bars = new InstancedMesh(new BoxGeometry(wide, 1, deep), new MeshStandardMaterial({ roughness: .55 }), cells.length), dummy = new Object3D();
+		bars.castShadow = true;
+		const place = (progress) => {
+			cells.forEach(({ f, b, level }, i) => {
+				const h = Math.max(.002, level * HEIGHT * progress);
+				dummy.position.set(b / (axis.length - 1) * 2 - 1, BASE + h / 2, 1 - f / Math.max(1, levels.length - 1) * 2);
+				dummy.scale.set(1, h, 1);
+				dummy.updateMatrix();
+				bars.setMatrixAt(i, dummy.matrix);
+			});
+			bars.instanceMatrix.needsUpdate = true;
+		};
+		cells.forEach(({ level }, i) => bars.setColorAt(i, ctx.color(ctx.palette.sequential(.15 + level * .85))));
+		ctx.reveal(place);
+		ctx.root.add(bars);
+		ctx.pick(bars, (i) => ({
+			title: `${SignalScales.hertz(axis[cells[i].b])} Hz`,
+			rows: [["Time", `${SignalScales.number(times[cells[i].f])} s`], ["Level", SignalScales.number(cells[i].level)]]
+		}));
+	}
+};
+export { SurfaceSpectrumStyle, WaterfallSurface3DChart };

package/dist/charts/signals/WaveformChart.js

@@ -0,0 +1,174 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SignalChart } from "./SignalChart.js";
+import { SignalDsp } from "./SignalDsp.js";
+import { SignalAmplitude, SignalLayout } from "./SignalEnums.js";
+import { SignalSamples } from "./SignalSamples.js";
+import { SignalScales } from "./SignalScales.js";
+import { area, scaleLinear } from "d3";
+// src/charts/signals/WaveformChart.ts
+var WaveformStyle = /* @__PURE__ */ function(WaveformStyle) {
+	WaveformStyle["Peak"] = "peak";
+	WaveformStyle["PeakRms"] = "peak-rms";
+	WaveformStyle["Line"] = "line";
+	WaveformStyle["Outline"] = "outline";
+	WaveformStyle["Bars"] = "bars";
+	return WaveformStyle;
+}({});
+var FLOOR = 60;
+var BAR = 5;
+/** Reads the loudness shape of long audio or sensor traces, as in an audio editor. */
+var WaveformChart = class extends SignalChart {
+	static meta = {
+		id: "signal-waveform",
+		name: "Waveform",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Shows amplitude over time for long sampled signals, keeping every peak at screen resolution.",
+		tags: [
+			"audio",
+			"peak",
+			"rms",
+			"soundwave"
+		],
+		sample: (seed) => SignalSamples.notes(seed).map((row) => ({
+			...row,
+			series: row.series === "Alpha" ? "Left" : "Right"
+		})),
+		variants: {
+			style: Object.values(WaveformStyle),
+			layout: Object.values(SignalLayout),
+			amplitude: [SignalAmplitude.Linear, SignalAmplitude.Decibel],
+			rectified: [false, true]
+		}
+	};
+	constructor(options) {
+		super({
+			yLabel: options.amplitude === SignalAmplitude.Decibel ? "Level (dB)" : "Amplitude",
+			...options
+		});
+	}
+	defaults() {
+		return {
+			...super.defaults(),
+			style: "peak",
+			layout: SignalLayout.Lanes,
+			amplitude: SignalAmplitude.Linear,
+			rectified: false
+		};
+	}
+	get laned() {
+		return this.options.layout === SignalLayout.Lanes && this.channels.length > 1;
+	}
+	get decibel() {
+		return this.options.amplitude === SignalAmplitude.Decibel;
+	}
+	/** Position on the signed unit range: linear, or dB above the floor as in an audio editor's dB view. */
+	shape(value) {
+		const unit = value / this.peak;
+		if (!this.decibel) return unit;
+		return Math.sign(unit) * Math.max(0, 1 + SignalDsp.decibel(Math.abs(unit), 1, -60) / FLOOR);
+	}
+	scales(ctx) {
+		const { width, height } = ctx.plot, x = scaleLinear(this.span, [0, width]);
+		if (this.laned) return {
+			x,
+			y: this.lanes(height)
+		};
+		const y = scaleLinear([this.options.rectified ? 0 : -1, 1], [height, 0]);
+		if (!this.decibel) {
+			const round = scaleLinear([0, this.peak], [0, 1]).ticks(3).filter(Boolean).map((tick) => tick / this.peak);
+			const ticks = this.options.rectified ? [0, ...round] : [
+				...round.map((tick) => -tick).reverse(),
+				0,
+				...round
+			];
+			return {
+				x,
+				y: SignalScales.labelled(y, ticks, (value) => SignalScales.number(value * this.peak))
+			};
+		}
+		const steps = this.options.rectified ? [
+			0,
+			1 / 3,
+			2 / 3,
+			1
+		] : [
+			-1,
+			-2 / 3,
+			-1 / 3,
+			0,
+			1 / 3,
+			2 / 3,
+			1
+		];
+		return {
+			x,
+			y: SignalScales.labelled(y, steps, (value) => value === 0 ? "-∞" : `${Math.round((Math.abs(value) - 1) * FLOOR)}`)
+		};
+	}
+	lane(channel, y) {
+		if (!this.laned) return y;
+		const band = y, top = band(channel.name), size = band.bandwidth();
+		return scaleLinear([this.options.rectified ? 0 : -1, 1], [top + size, top]);
+	}
+	plotMarks(ctx, { x, y }) {
+		const { style, rectified } = this.options;
+		const list = this.channels.map((channel) => {
+			return {
+				channel,
+				lane: this.lane(channel, y),
+				color: ctx.palette.color(channel.name),
+				values: rectified ? channel.v.map(Math.abs) : channel.v,
+				key: channel.name
+			};
+		});
+		const each = this.laned ? 1 : .55;
+		const band = (item, count, low, high) => area().x((bucket) => x(bucket.t)).y0((bucket) => item.lane(this.shape(low(bucket)))).y1((bucket) => item.lane(this.shape(high(bucket))))(SignalDsp.buckets(item.channel.t, item.values, count)) ?? "";
+		const low = (bucket) => rectified ? 0 : bucket.min, high = (bucket) => bucket.max;
+		const columns = ctx.plot.width / 1.5;
+		if (style === "peak") this.fill(ctx, "peak", list, (item) => item.key, (item) => band(item, columns, low, high), (item) => item.color, each);
+		if (style === "peak-rms") {
+			this.fill(ctx, "peak", list, (item) => item.key, (item) => band(item, columns, low, high), (item) => item.color, .32);
+			this.fill(ctx, "rms", list, (item) => item.key, (item) => band(item, columns, (bucket) => rectified ? 0 : -bucket.rms, (bucket) => bucket.rms), (item) => item.color, each);
+		}
+		if (style === "line") this.stroke(ctx, "trace", list, (item) => item.key, (item) => this.path(this.thin(item.channel, item.values, ctx.plot.width), x, (value) => item.lane(this.shape(value))), (item) => item.color, 1.5);
+		if (style === "outline") {
+			const edges = list.flatMap((item) => (rectified ? [high] : [high, low]).map((read, i) => ({
+				item,
+				read,
+				key: `${item.key}${i}`
+			})));
+			this.stroke(ctx, "edge", edges, (edge) => edge.key, (edge) => this.path(SignalDsp.buckets(edge.item.channel.t, edge.item.values, ctx.plot.width / 3).map((bucket) => [bucket.t, edge.read(bucket)]), x, (value) => edge.item.lane(this.shape(value))), (edge) => edge.item.color);
+		}
+		if (style === "bars") this.bars(ctx, list, x, low);
+		if (style !== "bars") this.timeProbe(ctx, x);
+	}
+	bars(ctx, list, x, low) {
+		const pitch = BAR * (this.laned ? 1 : list.length), count = ctx.plot.width / pitch, thick = 3;
+		const bars = list.flatMap((item, slot) => SignalDsp.buckets(item.channel.t, item.values, count).map((bucket, i) => ({
+			key: `${item.key}${i}`,
+			item,
+			bucket,
+			at: x(bucket.t) + (this.laned ? 0 : slot * BAR),
+			top: item.lane(this.shape(bucket.max)),
+			bottom: item.lane(this.shape(low(bucket)))
+		})));
+		const marks = ctx.marks("bars", "rect", bars, (bar) => bar.key).attr("fill", (bar) => bar.item.color).attr("rx", thick / 2);
+		ctx.set(marks, {
+			x: (bar) => bar.at,
+			width: thick,
+			y: (bar) => bar.top,
+			height: (bar) => Math.max(thick, bar.bottom - bar.top)
+		}, {
+			y: (bar) => (bar.top + bar.bottom) / 2,
+			height: 0
+		}, 1);
+		ctx.hover(marks, (bar) => ({
+			title: `${SignalScales.number(bar.bucket.t)} s`,
+			color: bar.item.color,
+			rows: [["Peak", SignalScales.number(bar.bucket.max)], ["RMS", SignalScales.number(bar.bucket.rms)]]
+		}));
+	}
+};
+export { WaveformChart, WaveformStyle };

package/dist/charts/signals/WaveletScalogram.js

@@ -0,0 +1,120 @@
+import { ChartFamily, DataShape, Dimension } from "../../core/enums.js";
+import { SignalDsp } from "./SignalDsp.js";
+import { SignalWavelet } from "./SignalEnums.js";
+import { SignalSamples } from "./SignalSamples.js";
+import { SignalScales } from "./SignalScales.js";
+import { TimeFrequencyChart } from "./TimeFrequencyChart.js";
+import { area, scaleLog } from "d3";
+// src/charts/signals/WaveletScalogram.ts
+var WaveletValue = /* @__PURE__ */ function(WaveletValue) {
+	WaveletValue["Magnitude"] = "magnitude";
+	WaveletValue["Power"] = "power";
+	WaveletValue["RealPart"] = "real-part";
+	return WaveletValue;
+}({});
+var WaveletAxis = /* @__PURE__ */ function(WaveletAxis) {
+	WaveletAxis["Period"] = "period";
+	WaveletAxis["Frequency"] = "frequency";
+	return WaveletAxis;
+}({});
+/** Wavelet transform heatmap: localises transients better than a spectrogram across many time scales. */
+var WaveletScalogram = class extends TimeFrequencyChart {
+	static meta = {
+		id: "signal-wavelet-scalogram",
+		name: "Wavelet scalogram",
+		family: ChartFamily.Scientific,
+		dimension: Dimension.Two,
+		shape: DataShape.Table,
+		description: "Shows a continuous wavelet transform across time and scale, with short events and long cycles both sharp.",
+		tags: [
+			"cwt",
+			"morlet",
+			"multiresolution",
+			"cone of influence"
+		],
+		sample: (seed) => SignalSamples.chirp(seed, 2048),
+		variants: {
+			wavelet: Object.values(SignalWavelet),
+			value: Object.values(WaveletValue),
+			axis: Object.values(WaveletAxis),
+			cone: [true, false],
+			ridge: [false, true]
+		},
+		valid: (values) => !(values.value === "real-part" && values.ridge === true)
+	};
+	constructor(options) {
+		super({
+			yLabel: options.axis === "frequency" ? "Frequency (Hz)" : "Period (ms)",
+			...options
+		});
+	}
+	defaults() {
+		return {
+			...super.defaults(),
+			wavelet: SignalWavelet.Morlet,
+			value: "magnitude",
+			axis: "period",
+			cone: true
+		};
+	}
+	cache;
+	get transform() {
+		const channel = this.channel, key = `${this.options.wavelet}|${channel.name}|${channel.v.length}|${channel.v[0]}`;
+		if (this.cache?.key !== key) this.cache = {
+			key,
+			field: SignalDsp.wavelet(channel.v, channel.rate, this.options.wavelet)
+		};
+		return this.cache.field;
+	}
+	get byPeriod() {
+		return this.options.axis !== "frequency";
+	}
+	/** Period of a value on the y axis. */
+	period(y) {
+		return this.byPeriod ? y / 1e3 : 1 / y;
+	}
+	yAxis(height) {
+		const { periods } = this.transform, lo = periods[0] ?? .001, hi = periods[periods.length - 1] ?? .1;
+		const domain = this.byPeriod ? [lo * 1e3, hi * 1e3] : [1 / lo, 1 / hi];
+		const scale = scaleLog(domain, [0, height]);
+		const [a, b] = [Math.min(...domain), Math.max(...domain)];
+		return SignalScales.labelled(scale, SignalScales.sparse(scale, a, b, 26).filter((tick) => tick >= a && tick <= b), this.byPeriod ? (value) => `${+value.toPrecision(3)}` : SignalScales.hertz);
+	}
+	field() {
+		const { periods, re, im } = this.transform, { value } = this.options, channel = this.channel;
+		if (!periods.length) return null;
+		const start = channel.t[0], logLo = Math.log(periods[0]), logStep = Math.log(periods[1] / periods[0]);
+		const raw = value === "magnitude" ? (a, b) => Math.hypot(a, b) : value === "power" ? (a, b) => a * a + b * b : (a) => a;
+		let top = 1e-12;
+		for (let s = 0; s < periods.length; s++) for (let i = 0; i < re[s].length; i += 4) top = Math.max(top, Math.abs(raw(re[s][i], im[s][i])));
+		const signed = value === "real-part";
+		return {
+			read: (time, y) => {
+				const s = Math.max(0, Math.min(periods.length - 1, Math.round((Math.log(this.period(y)) - logLo) / logStep)));
+				const i = Math.max(0, Math.min(re[s].length - 1, Math.round((time - start) * channel.rate)));
+				return raw(re[s][i], im[s][i]);
+			},
+			shade: (level) => level / top,
+			signed,
+			low: signed ? "-" : "0",
+			high: signed ? "+" : "Max",
+			unit: value === "power" ? "Power" : value === "real-part" ? "Real part" : "Magnitude"
+		};
+	}
+	overlay(ctx, { x, y }) {
+		if (!this.options.cone) return;
+		const { coi, periods } = this.transform, channel = this.channel;
+		if (!periods.length) return;
+		const stride = Math.max(1, Math.floor(coi.length / 120));
+		const edge = y(this.byPeriod ? periods[periods.length - 1] * 1e3 : 1 / periods[periods.length - 1]);
+		const limit = (period) => y(this.byPeriod ? Math.min(period, periods[periods.length - 1]) * 1e3 : 1 / Math.min(period, periods[periods.length - 1]));
+		const points = coi.filter((_, i) => i % stride === 0).map((value, i) => ({
+			t: channel.t[i * stride],
+			at: limit(Math.max(value, periods[0]))
+		}));
+		const shape = area().x((point) => x(point.t)).y0(edge).y1((point) => point.at);
+		this.fill(ctx, "cone", [points], () => 0, (list) => shape(list) ?? "", () => ctx.theme.surface, .62);
+		this.stroke(ctx, "cone-edge", [points], () => 0, (list) => this.path(list.map((point) => [point.t, point.at]), x, (value) => value), () => ctx.theme.ink, 1);
+	}
+};
+export { WaveletAxis, WaveletScalogram, WaveletValue };