SuperAPI AI 工具集

reveal-3d

前端与建站

查看项目

更新于 10-15 20:13

技能介绍

用途:在 Flows 应用中嵌入 Cognite Reveal 3D 查看器,通过 npm 包 @cognite/reveal-widget 渲染 CDF 中的 CAD 模型、点云、360° 图像集合和 CDF 场景,支持模型浏览或直接使用模型/修订 ID。适用于需要交互式查看 CDF 3D 内容的场景;不适用于静态图表、图可视化或无关的 Three.js 场景。

前提:应用使用 React + TypeScript,并由 @cognite/app-sdk 的 CogniteSdkProvider 包裹以提供 CogniteClient;CDF 项目需有 3D 模型,或用户提供模型/修订 ID、CDM(externalId/space)引用。需先确认 3D 内容位于 Core Data Model 还是经典 3D API,再设置 viewerOptions.useCoreDm,不要默认 true。

用法:安装依赖,例如 pnpm add @cognite/reveal-widget @cognite/reveal@4.36.0 @cognite/sdk react react-dom;在 vite.config.ts 加入 resolve.dedupe: ['three', '@cognite/reveal'];按场景内容配置 manifest.json 的 CSP;编写包装 RevealWidgetController 的控制器类,通过 setControllerRef 命令式驱动加载资源、样式/高亮实例和控制相机;挂载 RevealWidget 时传入 viewerOptions={{ sdk, useCoreDm }}、setControllerRef 和必填的 appIdentifier,容器需显式高度。资源句柄不再使用时调用 .remove()。

限制:不要复制源码包或使用旧的声明式 provider 树;不要嵌套本包的其他 provider;不要用 React.StrictMode;点云需应用侧同源修复;useCoreDm 配置错误会导致 401 或 360 集合静默失败;@cognite/reveal 需固定 4.36.0 并确保锁文件只解析一个版本。默认会上报匿名使用指标,可用 tracking={{ disabled: true }} 关闭。更多细节见 implementation.md、vite-config.md、csp-and-fixes.md。