The end-to-end solution for building and hosting better data apps, dashboards, and reports.
Public
Edited
Feb 25, 2024
3 forks
Importers
15 stars
qq({
x: jahanmi2.filter((d) => d.Bat === 2).map((d) => d.Y), // batch 2
y: jahanmi2.filter((d) => d.Bat === 1).map((d) => d.Y), // batch 1
stroke: "steelblue"
}).plot({
aspectRatio: 1,
grid: true,
nice: true,
x: {label: "Batch 2 →"},
y: {label: "↑ Batch 1"}
})
jahanmi2 = {
const text = await FileAttachment("JAHANMI2.DAT").text();
const lines = text.split("\r\n").slice(48, -1);
const [header,, ...rows] = lines.map((l) => l.trim().split(/\s+/g));
return rows.map((r) => Object.fromEntries(header.map((h, i) => [h, +r[i]])));
}
function qq({x: X, y: Y, ...options} = {}) {
const n = Math.min(X.length, Y.length);
function q(qi, i, Q) {
if (Q.length === n) return qi; // no interpolation required
const j = i / (n - 1) * (Q.length - 1);
const j0 = Math.floor(j);
const t = j - j0;
return t ? Q[j0] * (1 - t) + Q[j0 + 1] * t : Q[j0];
}
// Sort X and Y; interpolate as needed if the sets are different size.
X = d3.sort(X).map(q);
Y = d3.sort(Y).map(q);
// Compute the extent in X and Y.
const min = Math.min(X[0], Y[0]);
const max = Math.max(X[n - 1], Y[n - 1]);
return Plot.marks(
Plot.link({length: 1}, {x1: min, y1: min, x2: max, y2: max}),
Plot.dot({length: n}, {...options, x: X, y: Y})
);
}
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.
