
【免费下载链接】SkillsAgent skills for designers and builders using Codex, Claude, Cursor, and other AI coding agents项目地址https://gitcode.com/gh_mirrors/skills48/Skills点击查看免费下载导读3d-virtual-tour是 Skills 仓库 3D 渲染技能族 中的一员面向用 Three.js或类似渲染器构建有引导、可交互的三维虚拟漫游场景作者化相机路径、房间与户型图导航、轨道检查orbit inspection、模式平滑交接以及渐进加载。本文以 SKILL.md 为主干结合其 REFERENCES.md 与仓库中相邻技能的实现证据完整讲解漫游模型建立、路线编排、相机所有权、导航同步、性能与生命周期等落地要点。读完你将掌握一套可直接指导 Agent 或人工开发者在 Three.js 场景中实现建筑漫游 / 房产看房 / 博物馆 / 展厅级虚拟导览的完整工作流与验收清单。技能定位什么场景使用3d-virtual-tour技能 frontmatter 中给出了明确的触发条件description用于构建有引导且可交互的三维环境虚拟漫游支持作者化相机路径、房间与户型图导航、轨道检查、模式平滑交接与渐进加载典型场景包括建筑漫游、房产看房、博物馆、展厅以及任何基于 Three.js 或相似渲染器的可探索空间。在 3D 渲染技能总览 的选型表中它的定位是Guided walkthroughs, room and floor-plan navigation, orbit inspection, and smooth return to the tour引导式漫游、房间与户型图导航、轨道检查、平滑返回漫游。agents/openai.yaml中的默认提示词给出了 Agent 调用范式Use $3d-virtual-tour to build a guided walkthrough of this scene with room navigation, floor-plan links, and orbit inspection.值得注意的是它与相邻技能的分工可参见 3D Orbit and Inspect Demo 技能 中的Nearest skills说明3d-orbit-inspect-demo解决的是单个物体的悬停环绕与点击举起检查相机不飞行物体本身被移交到第二渲染层而3d-virtual-tour的orbit inspection是漫游的一种模式——相机本身会飞行、属于整个漫游状态机的一部分。选型时注意webgl-3d-object是漂浮的 hero 网格无检查模式3d-virtual-tour是一条穿过某个场所的相机路径。三者不要混用。一、建立漫游模型先盘点场景再决定导航模式动手写代码之前必须完整盘点既有场景坐标系、比例尺、楼层高度、门洞开口、渲染器、相机控制与资源加载路径asset-loading path并保留既有架构与交互而不是推倒重来。随后选择体验真正需要的导航模式技能给出了四种模式及其相机所有者分工表模式相机所有者导航方式引导漫游Guided tour作者化路线采样器authored route sampler滚动、播放/暂停、上一站/下一站房间目的地Room destination作者化的房间位姿或路线停靠点房间列表、热区hotspot或户型图检查Inspect有边界的轨道控制器bounded orbit controller拖拽、双指缩放、缩放、返回自由行走Free walk按需带碰撞的第一人称控制器移动与视角控制技能给出的默认组合是Seijaku 风格体验以引导路线为主辅以房间目的地与可选的模型检查只有被明确要求或确有必要时才加自由行走——仅仅使用轨道控制器并不能提供可步入的室内空间。另一个重要的诚实性约束如果源数据只是一组全景图片应使用链接式全景视点linked panorama viewpoints而不是暗示场景中存在可导航的几何深度。这一条决定了整个实现的数据模型走向必须在建模阶段就明确。二、编排一条穿过真实开口的路线2.1 路线键Route Keys的数据结构技能要求路线键至少存储四类信息进度/时间progress/time位置position注视目标或朝向look target or orientation视野field of viewFOV。停靠点stops需要稳定的 ID、标签、路线坐标与关联的资产组asset groups。特别强调路线坐标必须独立于页面高度或动画时钟这样当页面布局变化如滚动页面的段落高度改变时房间链接依然有效——这是把UI 状态与3D 相机状态解耦的关键设计。2.2 开口、眼高与节奏编排路径时的硬规则在狭窄开口的之前、之中、之后都要放置关键帧Place keys before, within, and after narrow openings否则相机在穿越门洞时会失控使用相对楼层高度的眼高floor-relative eye height并考虑抬高的地板与台阶在转弯或重要景观前减速保持地平线稳定避免位置、注视方向与视野同时大幅变化优先选择物理上合理的宽高比而不是用过度超广角镜头把房间拉伸变形。2.3 插值方式非均匀时间 Hermite 是默认弧长采样解决匀速问题技能明确指出 Seijaku 的实现采用非均匀时间 Hermite 关键帧nonuniform timed Hermite keys分别用于位置、注视与视野centripetal spline向心样条也是可用的替代方案。但无论用哪种曲线都必须意识到任意平滑曲线都可能把角切掉cut a corner——即使两个关键帧本身不与墙壁碰撞插值出的中间路径也可能穿墙。因此必须检查完整的插值路径包括相机近裁剪面near-plane的净空对墙壁、天花板、家具与门框逐项验证。另一个关键认知曲线参数不等于距离或旅行时间。当需要近似匀速移动时应当做弧长采样arc-length sampling而当需要制造停顿、逐次揭示地标时则应有意按时间分配片段intentionally time segments。技能建议查阅所安装渲染器的Curve参数化方法Three.js 的Curve、CatmullRomCurve3详见 REFERENCES.md 中收集的官方 API 文档链接。2.4 朝向与投影矩阵使用朝向键时用四元数 slerpquaternion slerp插值朝向如果插值的是注视目标look target必须防止目标与相机交叉或重合——目标越过相机位置会翻转相机方向当 FOV 或宽高比aspect改变时必须更新投影矩阵updateProjectionMatrix否则画面会失真或裁剪错误。三、单一控制器拥有相机状态机与模式交接3.1 每帧一次最终写入技能的核心原则是使用一个小型导航状态机navigation state machine并且每帧只有一次对相机的最终写入。输入只负责请求状态变更路线采样器、轨道控制器、过渡处理器不能各自独立地修改同一个活动相机。这从根本上杜绝了多个控制器互相拉扯相机的经典 bug。3.2 进入检查模式先保存再初始化进入检查inspection前必须保存当前路线坐标route coordinate活动停靠点active stop播放状态playback state任何滚动书签scroll bookmark。随后从观察者当前所在建筑侧的一个兼容视角初始化检查即不要从室内瞬间切到完全对立的室外视角。检查期间要冻结引导进度Freeze guided progression while inspecting。3.3 交接过渡直线会穿屋顶弧线也要验证位置、朝向与视野的混合交接必须沿一条经过验证的过渡路径进行。技能给出的现实教训非常具体从室内到室外的直线过渡可能穿过屋顶即使是一条向上的弧线也需要检查它可能撞上楼板或挑檐没有可信的连续路径时使用安全航点safe waypoints或者短暂淡出 目的地硬切brief fade and destination cut轨道控制器的距离与俯仰角必须限制在目标检查区域内clamp orbit distance and pitch防止用户把相机拖出建筑、拖进地面或无限拉远。3.4 返回漫游恢复、清除、防拉扯从检查返回时恢复之前保存的引导状态重新对账滚动位置reconcile scroll position清除陈旧的拖拽速度stale drag velocity否则物体会继续惯性滑动仅在返回前确实在播放时才恢复播放resume playback only if it was previously running禁用非活动控制器与过期的阻尼更新防止它们在过渡完成后继续把相机拉走新的导航请求应从当前位姿替换待定目的地而不是排队多个互相竞争的 tweenNew navigation requests should replace the pending destination from the current pose rather than queue several competing tweens。四、连接房间、地图与控件同一份停靠点注册表4.1 单数据源驱动一切 UI房间卡片room cards、章节导轨chapter rail、户型图区域floor-plan regions与场景热区scene hotspots必须由同一份停靠点注册表stop registry驱动保证列表里选房间和在户型图上点房间最终到达完全一致的相机位姿。两个易错点必须使用清晰的世界坐标到平面坐标的变换world-to-plan transform不能假设平面图的竖直轴就是世界 Z 轴——户型图通常是俯视投影坐标轴映射需要显式定义当前房间或路线段的高亮需要带滞回hysteresis在区域边界处避免来回闪烁。4.2 选房导航安全路线或有意剪切绝不直线穿墙房间选择要么沿一条安全的连接路线行进要么使用有意的剪切/淡入淡出intentional cut/fade绝不能通过直线插值穿过几堵墙Do not fly a direct interpolation through several walls。同时要保持状态一致性选中的标签与 URL 状态如果存在必须与实际目的地同步只在有意义的导航发生时更新浏览器历史而不是每帧都写 history。4.3 可访问性语义化、键盘可达、焦点管理停靠点用语义化 HTML 按钮或链接并在图形化地图旁提供键盘可达的房间列表热区要有标签label hotspots焦点必须可见退出检查时把焦点恢复到触发检查的元素Escape 键与可见的返回按钮都要能释放检查模式。4.4 滚动页面上的触控策略在滚动页面上触摸手势应继续滚动直到观察者显式进入交互模式指针捕获与touch-action应限定在活动 canvas 区域内Scope pointer capture and touch-action to the active canvas region处理指针取消pointer cancellation、捕获丢失lost capture与失焦blur退出时恢复之前的滚动样式不要拦截表单或无关页面控件上的滚轮或键盘输入——这是隔离交互区域的边界纪律。五、让世界与导航同步5.1 由路线坐标驱动场景状态门doors、字幕captions与曝光exposure等路线驱动的状态必须从当前路线坐标派生derive而不是由计时器驱动。技能给出了具体失败案例仅靠计时器的事件在用户 seek 回退或跳转到某个房间后可能留下一个挡在相机路径上的关闭的门。此外除非漫游显式拥有这些设置否则要保留用户选择的季节与光照覆盖——这与 3D Four Seasons 技能 的跨季节保持相机状态与交互一致原则互相呼应。5.2 预取与加载策略按**路线邻近度route proximity**预取即将到达的房间资产直接选择的非顺路的目的地在揭示之前先加载好加载期间显示有用的占位内容或保持稳定的视图失败的可选资产不应困住导航a failed optional asset should not trap navigation缓存共享纹理与网格新的请求到来后取消或忽略过期的目的地工作。5.3 区域可见性按模式重算区域可见性region visibility如按房间裁剪/隐藏墙体只有在当前相机模式下仍然正确时才可使用。沿着引导路径隐藏的区域在用户切换到轨道检查绕模型观察时可能变得可见此时必须重算可见性或启用所需区域否则会出现缺墙少房的穿帮画面。5.4 自由行走的边界如果包含自由行走移动必须约束在可行走的表面上并提供碰撞/净空检查Pointer Lock 只提供视角输入不提供碰撞与地板跟随Pointer lock supplies look input, not collision or floor following触屏用户需要等价的导航路径以及从沉浸式控制中可见的退出方式。六、运动、加载与生命周期6.1 时间基准与页面隐藏使用基于帧时间frame-time的插值并在页面隐藏后重置时间基准reset the time base after hiding the page否则恢复可见时第一帧会把隐藏期间累积的 dt 一次性补上造成瞬移页面隐藏时暂停播放与不必要的渲染。6.2 减少动效Reduced Motion在prefers-reduced-motion下保留一个静态但有信息量的视图房间按钮应能直接选择合成视图composed views而不是强制长距离相机飞行。6.3 音频音频只在用户手势之后开始播放跨导航保持静音状态preserve its mute state across navigation。6.4 性能纪律与卸载保持单一渲染循环复用 scratch 对象避免在指针处理器内做布局读取或大分配先准备开场房间把昂贵的场景生成、纹理上传与着色器编译分散到合适的阶段相机取景framing与渲染目标render targets要一起 resize调整窄视构图时不要移动相机进入几何体内部tune narrow-view compositions without moving the camera into geometry漫游卸载unmount时移除监听器、释放捕获、销毁自有资源remove listeners, release capture, and dispose owned resources。七、验证清单按技能要求逐项验收技能在 Verify 一节给出了完整的验收矩阵这是把漫游交付给用户的最后一道关完整走完路线正向与反向检查每一个开口、每一处高程变化、每一次室内/室外过渡从列表与户型图各选一次每个房间标签、门、资产与相机目的地必须一致从起点、室内、终点三个位置进入检查拖拽/缩放后返回时必须精确恢复到保存的停靠点与播放状态中断过渡用另一个目的地、Escape、窗口 resize 或隐藏标签页间隔打断过渡确认始终只有一个相机所有者且没有卡死的滚动锁键盘导航、触摸滚动、指针取消、减少动效、资产加载失败逐项测试检查桌面与竖屏portrait布局、着色器/控制台错误、开场加载、目的地加载与交互帧时间interaction frame time。八、参考资料与源码依据技能的 REFERENCES.md 是仅链接式的参考清单其中Seijaku 实现参考外部开源项目包括作者化相机路线与采样器authored camera route and sampler、轨道检查与交接orbit inspection and handoff、房间与户型图导航rooms and floor-plan navigation三处带行号锚点的实现位置Three.js 官方 APICurve参数化方法、CatmullRomCurve3向心/中心样条、PerspectiveCamera投影矩阵与 FOV、OrbitControls有界轨道控制与PointerLockControls指针锁定输入。需要澄清的边界技能的 Reference 一节明确说明Seijaku 的引导漫游与外观检查属于参考技术reference techniques而基于碰撞的自由行走与上文额外的可访问性检查属于实现指导implementation guidance并不是对参考实现特性的声称。这一点保证了文章/技能中的做法与对参考项目的断言严格区分不会误导读者。在仓库内部与本技能配套的使用入口还包括3D 渲染技能总览技能选型表与调用示例、Agent 接口元数据Codex 等 Agent 的展示名与默认提示词以及与检查模式形成对照的 3D Orbit and Inspect Demo。按照仓库约定见根目录 README.md每个技能文件夹由SKILL.mdAgent 加载并遵循的操作手册 可选的REFERENCES.md仅链接agents/openai.yamlCodex 接口元数据组成3d-virtual-tour恰好三件齐全。结语3d-virtual-tour提供了一条从盘点场景 → 选择导航模式 → 编排真实开口的路线 → 单一相机所有者 → 同步世界状态 → 性能与生命周期 → 逐项验收的完整实施链路。它的价值不在于某一段炫技代码而在于一整套可被 Agent 与开发者共同遵循的约束系统路由数据独立于页面布局、插值路径必须逐帧验证净空、交接过渡必须验证可行路径、导航 UI 共享同一停靠点注册表、以及每一处交互都配套可访问性与降级策略。无论是给 Codex/Claude/Cursor 等 Agent 加载还是作为人工开发的检查清单这套流程都足以支撑把任意 Three.js 场景升级为看得懂、走得通、查得清的专业虚拟漫游体验。赞分享【免费下载链接】SkillsAgent skills for designers and builders using Codex, Claude, Cursor, and other AI coding agents项目地址https://gitcode.com/gh_mirrors/skills48/Skills点击查看免费下载相关推荐Watchman 构建验证环境用 Vagrant 搭建可复现的多平台构建虚拟机Watchman 构建验证环境用 Vagrant 搭建可复现的多平台构建虚拟机 本指南基于 watchman/build/vagrant/README.md后端开发工具DLSS Swapper 使用教程3 步完成游戏内 DLSS/FSR/XeSS 版本替换无需等待官方更新DLSS Swapper 使用教程3 步完成游戏内 DLSS/FSR/XeSS 版本替换无需等待官方更新 游戏还锁在旧版 DLSS官方迟迟不发补丁。DLS桌面应用ViMax终极指南如何用AI一键生成专业级视频的完整教程ViMax终极指南如何用AI一键生成专业级视频的完整教程 想要从创意到视频却总是卡在复杂的制作流程中ViMax智能视频生成框架正是为解决这个痛点而生。这个人工智能AI Agent多智能体媒体生成视频上一篇炉石传说终极优化指南60项功能一键解锁的HsMod插件下一篇Seraphine英雄联盟玩家的5大核心功能终极助手一键提升游戏体验创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考