Published
Edited
Feb 19, 2020
Insert cell
Insert cell
pulsingCircle = {
const canvas = html`<svg></svg>`;
const circle = canvas.appendChild(svg`<circle cx=150 cy=75 fill=orange />`);
let animation = requestAnimationFrame(function tick() {
circle.setAttribute("r", Math.sin(Date.now() / 1000) * 50 + 50);
animation = requestAnimationFrame(tick);
});
invalidation.then(() => cancelAnimationFrame(animation));
return canvas;
}
Insert cell
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