Pointcloud Animation

This example demonstrates how to animate point clouds using Vuer's TimelineControls and the global app.update method. It loads a 3D mesh and pre-computed trajectory data, then updates point cloud positions frame-by-frame based on timeline events.

Key concepts:

Using app.update to broadcast updates to all connected clients
Pre-populating the scene with initial components via Set
Handling TIMELINE_STEP events to synchronize animations
Displaying multiple point clouds with different colors

Code Example

python

import asyncio

import numpy as np
import open3d as o3d

from vuer import Vuer
from vuer.events import ClientEvent, Set
from vuer.schemas import DefaultScene, PointCloud, TimelineControls, TriMesh

mesh = o3d.io.read_triangle_mesh("assets/suzanne.ply")
vertices = np.asarray(mesh.vertices)
faces = np.asarray(mesh.triangles)

app = Vuer()

infill = np.load("assets/suzanne_infill_good_traj.npy")
surface_infill = np.load("assets/suzanne_surface_fill_only.npy")

@app.spawn
async def main(proxy):
    proxy @ Set(
        DefaultScene(
            TriMesh(vertices=vertices, faces=faces, position=[0, 0, 0], wireframe=True),
            PointCloud(key="surface", vertices=vertices, size=0.001),
            PointCloud(key="infill", vertices=vertices, size=0.001),
        ),
    )

    while True:
        await asyncio.sleep(1.0)

async def frame_handle(e: ClientEvent, _):
    print("frame handle")

    step = e.value["step"]
    step = step % len(infill)

    app.update @ [
        TimelineControls(end=len(infill), step=step, speed=1.0, paused=False, key="timeline"),
        PointCloud(key="infill", vertices=infill[step], position=[0, 0, 0], color="red"),
        PointCloud(
            key="surface",
            vertices=surface_infill[step],
            position=[0.8, 0, 0],
            color="green",
        ),
    ]
    print("updated the scene")


app.add_handler("TIMELINE_STEP", frame_handle)
app.start()