Plot.plot(
(() => {
const n = 4;
const keys = Array.from(
d3.union(
datasaurus.filter((d) => d.dataset != "dino").map((d) => d.dataset)
)
);
const index = new Map(keys.map((key, i) => [key, i]));
const fx = (key) => index.get(key) % n;
const fy = (key) => Math.floor(index.get(key) / n);
return {
height: 700,
width: 1150,
marginBottom: 30,
y: { insetTop: 10 },
fx: { padding: 0.05 },
marks: [
Plot.frame({ fill: "#eaeaea" }),
Plot.gridY({ stroke: "white", strokeOpacity: 1 }),
Plot.gridX({ stroke: "white", strokeOpacity: 1 }),
Plot.dot(
datasaurus.filter((d) => d.dataset != "dino"),
{
fill: "#404042",
opacity: 0.5,
fx: (d) => fx(d.dataset),
fy: (d) => fy(d.dataset),
x: "x",
y: "y"
}
),
]
};
})()
)