Public
Edited
Mar 8, 2023
Insert cell
Insert cell
{
let random = d3.randomUniform(1,100);
let format = d3.format(".0f")

const div = d3.create("div")
.property("_current", Math.round(random()));


while (true) {
let data = Math.round(random());

div
.datum(data)
.join('text')
.style('font-size', 14)
.style('font-family', 'sans-serif')
.text(d => d)
.transition()
.duration(1000)
.style("color", data%2 ==0 ? "blue": "red")
.textTween(function(d) {
const i = d3.interpolate(this._current, d);
return function(t) { return format(this._current = i(t)); };
})

yield div.node();

await Promises.tick(2000)
}


}
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