Published
Edited
Nov 21, 2019
3 stars
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
bands = [31.25, 62.5, 125, 250, 500, 1000, 2000, 4000, 8000, 16000]
Insert cell
Insert cell
Insert cell
filters = bands.map((freq, i) => {
const f = context.createBiquadFilter();

f.Q.value = qValue;
f.frequency.value = freq;
f.gain.value = gains[i] !== undefined ? gains[i] : 0;

if (i === 0) {
f.type = 'lowshelf';
} else if (i === bands.length - 1) {
f.type = 'highshelf';
} else {
f.type = 'peaking';
}

f.connect(context.destination);
return f;
});
Insert cell
responses = {
const noctaves = 10;
const width = 500;
return filters.map((filter) => {
const freqHz = new Float32Array(width);
const magResponse = new Float32Array(width);
const phaseResponse = new Float32Array(width);
const nyquist = 0.5 * context.sampleRate;

for (let i = 0; i < width; i++) {
let f = i / width;
// convert to log frequency scale (octaves)
f = nyquist * Math.pow(2.0, noctaves * (f - 1.0));

freqHz[i] = f;
}

filter.getFrequencyResponse(freqHz, magResponse, phaseResponse);

return {
freqHz,
magResponse,
phaseResponse,
}
});
}
Insert cell
allMagResponse = {
const points = [];
const allMagResponse = new Float32Array(responses[0].magResponse.length);
for (let i = 0; i < allMagResponse.length; i++) {
allMagResponse[i] = 1;
}
for (let bandI = 0; bandI < responses.length; bandI++) {
for (let i = 0; i < responses[bandI].magResponse.length; i++) {
allMagResponse[i] *= responses[bandI].magResponse[i];
}
}
for (let i = 0; i < allMagResponse.length; i++) {
const dbResponse = 20.0 * Math.log(allMagResponse[i]) / Math.LN10;
points.push({ freq: responses[0].freqHz[i], db: dbResponse, band: 'combined' });
}
return points;
}
Insert cell
data = {
const points = [];
for (let bandI = 0; bandI < responses.length; bandI++) {
for (let i = 0; i < responses[bandI].magResponse.length; i++) {
const dbResponse = 20.0 * Math.log(responses[bandI].magResponse[i]) / Math.LN10;
points.push({ freq: responses[bandI].freqHz[i], db: dbResponse, band: bands[bandI] });
}
}
points.push(...allMagResponse);
return points;
}
Insert cell
import {vl} from '@vega/vega-lite-api'
Insert cell
import {slider} from "@jashkenas/inputs"
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more