Documentation/Source example
Example source
samples/vis/Builtin - Spectrum.js
Referenced by:vis.Create
include('docs/Flags.js');
// JSplitter vis sample: Spectrum | built-in (GDI or Direct2D).
// Source: FFT frequency bands and held peaks; render options affect only the presentation.
// JSplitter vis: Spectrum — source and built-in renderer at their defaults.
//
// source controls audio analysis and signal dynamics. It produces normalized
// spectrum levels/peaks independently of how they are drawn.
// render controls only the built-in spectrum presentation.
//
// The dB magnitude scale is relative to the FFT output; it is not a calibrated
// dBFS meter.
vis.UpdateIntervalMs = 16; // Default: 16 ms; allowed: unsigned integer 1..4294967295 ms.
// Default colors are resolved from the current DUI/CUI text color.
// InstanceType: 1 = DUI, 0 = CUI; color identifier 0 = text in both.
const textColor = window.InstanceType === 1
? window.GetColourDUI(0) : window.GetColourCUI(0);
// Match the background as well, so theme-colored content remains visible.
const backgroundColor = window.InstanceType === 1
? window.GetColourDUI(1) : window.GetColourCUI(1);
const spectrum = vis.Create(VisSourceType.Spectrum, {
channel: "mix", // Default: "mix"; also accepts a vis.AudioFormat channel name or unsigned PCM index.
fftSize: 4096, // Default: 4096; allowed: power of two, 256..16384.
bands: 64, // Default: 64; allowed: integer 4..4096.
minFrequency: 40, // Default: 40 Hz; allowed: 0 < value < maxFrequency.
maxFrequency: 23000, // Default: 23000 Hz; allowed: value > minFrequency.
minDb: -72, // Default: -72 dB; allowed: -160 <= value < maxDb.
maxDb: 0, // Default: 0 dB; allowed: minDb < value <= +24.
gain: 1, // Default: 1; allowed: > 0.
attackMs: 18, // Default: 18 ms; allowed: >= 0 ms.
releaseMs: 120, // Default: 120 ms; allowed: >= 0 ms.
peakHoldMs: 150, // Default: 150 ms; allowed: >= 0 ms.
peakGravity: 3 // Default: 3; allowed: >= 0.
}, {
// 0 draws one bar per source band while they fit; excess right-side bands
// are clipped. A non-zero value chooses as many visible bars as fit the current
// Draw() width; source bands stay unchanged.
barWidth: 0, // Default: 0; allowed: integer 0..64 px (0 = automatic).
gap: 1, // Default: 1 px; allowed: integer 0..64 px.
// 1..256 {to, color} zones; 'to' strictly increasing in -160..+24 dB.
// Default is the DUI/CUI text color over the entire source dB range.
// Three-color ranges example:
// ranges: [
// { to: -18, color: 0xff4caf50 },
// { to: -6, color: 0xffffeb3b },
// { to: 0, color: 0xfff44336 }
// ],
ranges: [{ to: 0, color: textColor }], // Default: Entire dB range in UI text color; allowed: 1..256 {to, color} entries; increasing to in -160..+24; 32-bit ARGB colors.
segmentSize: 6, // Default: 6 px; allowed: integer 0..1024 px (0 = automatic).
segmentGap: 0, // Default: 0; allowed: integer 0..64 px.
colorMode: "gradient", // Default: "gradient"; allowed: "gradient" or "discrete".
showPeak: true, // Default: true; allowed: true or false. draw the source peak marker.
peakColor: textColor, // Default: DUI/CUI text color (ARGB); allowed: ARGB uint32, 0x00000000..0xFFFFFFFF.
peakSize: 1 // Default: 1 px; allowed: integer 1..64 px.
});
function on_paint(gr) {
const w = window.Width, h = window.Height;
gr.FillSolidRect(0, 0, w, h, backgroundColor);
if (w > 0 && h > 0) spectrum.Draw(gr, 0, 0, w, h);
}
setInterval(() => window.Repaint(), 33);