位移与变换 · 移动、旋转、缩放
拖拽环绕 3D 展厅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
配方
拖拽环绕 3D 展厅 → 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
给 AI 的一句话
做一个拖拽环绕的 3D 展厅：拖拽量先过一层指数阻尼（每帧 ×0.92）再喂给相机的 yaw，所以松手会滑一段；物件按透视关系各自位移（近快远慢）。每帧把每个锚点的世界坐标用 project() 投回屏幕坐标，再用这个坐标摆对应的 HTML 标签 —— 标签因此能牢牢贴在物件旁边。阻尼要按 dt 归一，换台机器速度才一致。