Movement & Transforms · Move, rotate, scale
Drag-orbit 3D showroom拖拽环绕 3D 展厅
- orbits around you
- weighty
- labels stay pinned
Drag left or right and it is not the products that move — you orbit the shelf. Near objects travel faster than far ones, the drag has weight, and it keeps gliding after you let go. The labels beside each object stay pinned exactly where they belong as everything turns.
When to use it
Use it for showrooms, property and car walkthroughs, museums, and spatial stories. Do not use it with one or two items, or when people came to order quickly — orbiting costs time before anything is visible.
Parameters
camera yaw driven by drag through exponential damping ×0.92 per frame · orbit radius 150px · anchor projected with project() each frame · HTML labels follow the projection
Recipe
Drag-orbit 3D showroom → camera yaw driven by drag through exponential damping ×0.92 per frame · orbit radius 150px · anchor projected with project() each frame · HTML labels follow the projection
One sentence for your AI
Build a drag-orbit 3D showroom: run the drag delta through exponential damping (×0.92 per frame) before feeding it to the camera yaw, so it glides after release; objects then move by perspective, near ones faster than far ones. Each frame, project every anchor's world position back to screen coordinates and place its HTML label with the result, so labels stay pinned beside their objects. Normalise the damping by dt so the feel is the same on any machine.