Published
Edited
Jun 20, 2022
Insert cell
Insert cell
Insert cell
Insert cell
{
let rects = []
for(let i = 0; i <= n_rects; i++) {
rects.push(
`<div class = "lantern"></div>`
)
}
const lanterns = html`<div class = "container">${rects.join(" ")}</div>`

gsap.set(document.querySelectorAll(".container"), {
transformStyle:"preserve-3d"
})
gsap.to(
lanterns.querySelectorAll(".lantern"), {
transformOrigin: "0% 0%",
rotationY: (i) => degree / n_rects * -i,
duration: 3,
repeat: -1,
yoyo:true
}
)
return lanterns
}
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
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