/**
* Plot the data with the time ax x, and valueName column as y.
*/
plot = (data, valueName, k = 100) => {
return Plot.plot({
y: { grid: true },
color: {
scheme: "BuYlRd",
// interpolate: d3.interpolateRgb.gamma(2),
// range: ["#00a", "#a00"],
domain: [-1, 1],
legend: true
},
marks: [
// Zero line
Plot.ruleY([0]),
// Background curves
Plot.lineY(data, {
x: "time",
y: valueName,
fy: true ? undefined : "signal",
z: "signal",
stroke: (d) => "gray",
opacity: 0.2
}),
// Highlight curves
Plot.lineY(
data.filter((d) => d.signal === displaySetup.highlightSignal),
Plot.map(
{
stroke: Plot.window({
k,
reduce: "difference"
})
},
{
x: "time",
y: valueName,
fy: true ? undefined : "signal",
z: "signal",
stroke: valueName,
strokeWidth: 2
}
)
),
Plot.linearRegressionY(
data.filter((d) => d.signal === displaySetup.highlightSignal),
{ x: "time", y: valueName, stroke: "red" }
),
//
Plot.text(data, {
filter: (d) => d.time === data.T - 1,
x: "time",
y: valueName,
text: "signal",
fontSize: 15,
fill: "gray",
lineAnchor: "top",
dx: 6
})
]
});
}
pcaTable = {
const { data: feature1 } = pca.predict(matrixBrownian),
{ data: feature2 } = pca.predict(matrixBrownianBridge),
{ T } = data;
const table = [];
for (let t = 0; t < T; ++t) {
table.push({
f1: feature1[t][0],
f2: feature1[t][1],
time: t,
name: "Brownian"
});
table.push({
f1: feature2[t][0],
f2: feature2[t][1],
time: t,
name: "BrownianBridge"
});
}
return table;
}
pcaTable
Type Table, then Shift-Enter. Ctrl-space for more options.
pca.predict(matrixBrownian)
pca.predict(matrixBrownianBridge)
pca.S.map((v, i) => v / d3.sum(pca.S))
pca = new PCA(matrixBrownian, { center: true, scale: true })
{
var sum = [],
mean1 = [],
mean2 = [];
for (let j = 0; j < data.n; ++j) {
sum.push([...new Array(data.n).fill(0)]);
mean1.push(d3.mean(matrixBrownian, (d) => d[j]));
mean2.push(d3.mean(matrixBrownianBridge, (d) => d[j]));
}
for (let j = 0; j < data.n; ++j) {
for (let k = 0; k < data.n; ++k) {
for (let i = 0; i < data.T; ++i) {
sum[j][k] +=
(matrixBrownian[i][j] - mean1[j]) *
(matrixBrownianBridge[i][k] - mean2[k]);
}
}
}
var s;
for (let j = 0; j < data.n; ++j) {
s = sum[j][j];
for (let k = 0; k < data.n; ++k) {
sum[j][k] /= s;
}
}
return sum;
}
matrixBrownian = table2matrix("brownian")
matrixBrownianBridge = table2matrix("brownianBridge")
table2matrix = (column = "brownian") => {
const { T, n } = data;
const matrix = [];
for (let t = 0; t < T; ++t) {
matrix.push([...new Array(n).fill(0)]);
}
data.map((d) => {
matrix[d.time][d.signal] = d[column];
});
return matrix;
}
PCA = (await require("https://bundle.run/ml-pca@4.0.2")).PCA
data.filter((d) => d.time === data.T - 1)
data = mkData(dataSetup.length, dataSetup.signals)
data
Type Table, then Shift-Enter. Ctrl-space for more options.
/**
* Make data for T length and n signals.
**/
mkData = (T, n) => {
const data = [];
var x,
xT = [],
b,
invT = 1.0 / T,
rnd = d3.randomNormal();
for (let i = 0; i < n; ++i) {
x = 0;
for (let t = 0; t < T; ++t) {
data.push({
signal: i,
time: t,
brownian: x,
brownianAccumulate: x + (i > 0 ? d3.sum(xT.slice(0, i)) : 0)
});
if (t === T - 1) {
xT.push(x);
} else {
x += rnd();
}
}
}
data.map((d) => {
b = d.brownian - (d.time + 1) * invT * xT[d.signal];
Object.assign(d, { brownianBridge: b });
});
Object.assign(data, { T, n });
return data;
}
/**
* Make data for T length and n signals.
**/
mkData1 = (T, n) => {
const data = [];
var x,
b,
invT = 1.0 / T,
rnd = d3.randomNormal();
for (let i = 0; i < n; ++i) {
x = 0;
b = 0;
for (let t = 0; t < T; ++t) {
data.push({
signal: i,
time: t,
brownian: x,
brownianBridge: b
});
x += rnd();
b = x - t * invT * x;
}
}
Object.assign(data, { T, n });
return data;
}
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.
