Published
Edited
Jul 4, 2020
1 star
Insert cell
Insert cell
d3 = {
const d3 = await require("d3@5", "d3-array@2");
d3.selection.prototype.move_to = function({ x = 0, y = 0 }) {

this.each(function(d) {
const x_pos = typeof x === "function" ? x(d) : x;
const y_pos = typeof y === "function" ? y(d) : y;
d3.select(this).attr("transform", `translate(${x_pos},${y_pos})`);
});

return this;
};
return d3;
}
Insert cell
{
const svg = d3.select(DOM.svg(125, 125));

const g_els = svg
.selectAll('circle')
.data([25, 50, 75, 100])
.join('circle')
.attr('r', 5)
.move_to({ x: d => d, y: d => d });

return svg.node();
}
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