{
let plt;
plt = Plot.plot({
x: { nice: true },
y: { nice: true, domain: [-1.2, 1.2] },
width,
grid: true,
color: {
legend: true,
// scheme: "Tableau10",
domain: ["r", "phi", "raw", "hilbert"],
range: ["gray", "purple", "red", "green"],
nice: true
},
marks: [
Plot.frame(),
Plot.ruleY([0]),
Plot.areaY(data, {
x: "x",
y: "r",
stroke: (d) => "r",
fill: (d) => "r",
fillOpacity: 0.2
}),
Plot.line(data, {
x: "x",
y: "phi",
stroke: (d) => "phi",
strokeDasharray: "5, 3, 1"
}),
Plot.line(data, {
x: "x",
y: "y",
marker: true,
stroke: (d) => "raw"
}),
Plot.line(data, { x: "x", y: "h", stroke: (d) => "hilbert" })
]
});
return plt;
}
data = mkHilbertData(nSamples, nOctaves)
data
Type Table, then Shift-Enter. Ctrl-space for more options.
mkHilbertData = (nSamples, nOctaves) => {
let data = [],
xScaler = d3.scaleLinear().domain([0, nSamples]).range([0, 1]),
t = performance.now(),
x,
y;
for (let i = 0; i < nSamples; ++i) {
x = xScaler(i);
y = noiseGen.noise3D(1, x * nOctaves, t);
data.push({ x, y });
}
hilbertTransform(data.map((d) => d.y)).map((d, i) =>
Object.assign(data[i], { h: d })
);
data.map((d) => Object.assign(d, { r: _r(d), phi: _phi(d) }));
return data;
}
_r = (d) => {
return Math.sqrt(d.h * d.h + d.y * d.y);
}
_phi = (d) => {
return Math.atan(d.h, d.y) / Math.PI;
}
noiseGen = {
let simplexNoise = await require("simplex-noise@2.4.0");
let noiseGen = new simplexNoise(performance.now());
return noiseGen;
}
d3 = require("d3")
function hilbertTransform(input, options = {}) {
const { inClockwise = true } = options;
const array = [0, ...input, 0];
const result = new Float64Array(input.length);
for (let k = 1; k < array.length - 1; k++) {
let aSum = 0;
for (let i = 0; i < k - 1; i++) {
const log = Math.log((k - i) / (k - i - 1));
aSum += array[i] * log + (array[i + 1] - array[i]) * (-1 + (k - i) * log);
}
const b = array[k - 1] - array[k + 1];
let cSum = 0;
for (let i = k + 1; i < array.length - 1; i++) {
const log = Math.log((i - k) / (i - k + 1));
cSum += array[i] * log + (array[i - 1] - array[i]) * (1 + (i - k) * log);
}
result[k - 1] = ((inClockwise ? 1 : -1) * (aSum + b + cSum)) / Math.PI;
}
return result;
}
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.
