Public
Edited
Apr 3, 2023
1 fork
Insert cell
Insert cell
{
const container = d3.select(DOM.svg(300,300)).attr("style","border:1px black solid")
let circle
container.on("click",() => {
mutable toggle = -mutable toggle
try{circle.active = false}
catch{}
})
if(toggle == 1){
circle = new Circle(container)
circle.talk()
}
yield container.node()
}
Insert cell
class Circle{
constructor(element){
this.active = true
this.circle = element.append("circle")
.attr("r",50)
.attr("cx",150)
.attr("cy",150)
}

async talk(){
while(this.active){
const r = d3.randomUniform()()
await this.circle.transition().duration(1000).attr("cx",150).end()
console.log(r)
}
}
}
Insert cell
mutable toggle = 1
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