Public
Edited
Mar 27, 2024
randNums = {
let data = [];
for (let i=0; i<count; i++) {
data.push(Math.round(Math.random()*500))
}
return data;
}
count = 8
numsSVG = d3.create("svg").attr("height",300).attr("width",300)
text = numsSVG.selectAll("text")
.data(randNums)
.join("text")
.transition().duration(1000)
.text(d => d)
.style("text-anchor", "middle")
.attr("x", d => d)
.attr("y", (d,i) => i);
circles = numsSVG.selectAll("circle")
.data(randNums)
.join("circle")
.transition().duration(1000)
.style("fill", "none")
.style("stroke", "steelblue")
.attr("r", d => d/10)
.attr("cx", d => d)
.attr("cy", (d, i) => 15 + i*d)
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.
