第 0003 课 · 上一课 · 术语表

IFC 几何到浏览器的链路

三条路线,各自的甜点与陷阱——技术选型的核心。

上一课留下的两个问题

上一课那张渲染管线图末尾,留了两个决策点:

  1. tessellate 在哪儿做?浏览器里现做,还是后端预先做好?
  2. 预转产物用什么格式?glTF 单文件,还是 3D Tiles 流式切片?

这两个问题的组合,恰好对应业界三条主流路线。这节课把三条路线并排放,让你看到各自的甜点与陷阱。这是后续写 ADR 的核心素材。整课 8 分钟可读完。

三条路线全景

路线 A · 浏览器原生解析 web-ifc + That Open Engine IFC 文件 WASM 解析 + tessellate Web Worker,运行时 Three.js 渲染 甜点 实时、无需预转 支持编辑交互 陷阱 大模型卡死 内存压力大 适合 中小模型 单栋 ≤ 数百 MB 路线 B · 后端预转 glTF IfcOpenShell + Three.js/xeokit IFC 文件 tessellate + 导出 GLB 上传时一次性,Python CLI glTF/GLB 静态文件 甜点 浏览流畅 开源全栈可控 陷阱 需自建转换服务 大园区仍需 3D Tiles 适合 Pivot 主力路线 单建筑~小园区 路线 C · APS 商业 SaaS Autodesk Platform Services RVT/IFC/DWG 等 Model Derivative → SVF2 云端转换,按量计费 APS Viewer 渲染 甜点 支持 60+ 格式 开箱即用 陷阱 闭源、按量计费 数据出域、合规风险 适合 已深度用 Revit 可接受厂商绑定
图 1:三条路线的核心差异在 tessellate 的位置和产物格式。注意每条路线的"适合"标注——这是选型决策的关键。

路线 A:浏览器原生解析(web-ifc)

核心组件web-ifc(C++ 写、编译为 WASM 的 IFC 解析器)+ That Open Engine(其上的 BIM 应用框架)+ Three.js 渲染。

用户上传 IFC,浏览器用 WASM 实时解析 + tessellate,渲染到 Three.js 场景。所有几何计算在浏览器里现做,无需后端预转

甜点

陷阱

业界共识:web-ifc 路线只适合中小模型(数百 MB 以内)和交互编辑场景,不适合做运营期数字孪生的主视图。主视图必须预转。

路线 B:后端预转 glTF(推荐主力)

核心组件IfcOpenShell(C++/Python,服务端事实标准)做转换 + xeokit 或 Three.js 做浏览渲染。

用户上传 IFC 后,后端用 IfcOpenShell 一次性 tessellate + 导出为 GLB(二进制 glTF)。GLB 作为静态文件存储,浏览器直接加载渲染。

关键命令行:

# 最简转换
IfcConvert input.ifc output.glb

# xeokit 推荐参数(含切片)
IfcConvert input.ifc output.xkt \
  --include geometry \
  --geometry-slice-size 50 \      # glb 切片 ≤ 50MB
  --geometry-tessellated-edges \  # 边线提取(BIM 风格线框)
  --cell-size 200                 # 按 200m 立方体分块

甜点

陷阱

路线 C:APS 商业 SaaS(Autodesk)

核心组件APS Model Derivative API(云端转换)+ APS Viewer(前端渲染)。

上传任意格式(RVT/IFC/DWG/NWD 等 60+ 种),APS 云端转成 SVF2 私有格式,浏览器用 APS Viewer 渲染。

甜点

陷阱

路线 B 的子决策:glTF 还是 3D Tiles?

选了预转路线(B),还要决定预转产物格式。两者不是对立,而是不同尺度的方案:

维度glTF / GLB3D Tiles
定位3D 资产传输("3D 的 JPEG")海量地理空间流式(OGC 标准)
尺度单模型 / 单建筑园区 / 城市 / 国家
加载方式整体加载层级流式(HLOD,按视锥裁剪)
关系3D Tiles 的叶子瓦片就是 glTF——后者是前者的子集
渲染引擎Three.js / xeokit 等通用CesiumJS(注意:2024-09 已被 Bentley 收购)
Pivot 建议起步阶段足够园区/城市级再引入

建议:先 glTF,后 3D Tiles。Pivot 起步阶段(单栋/单园区建筑),glTF 完全够用。3D Tiles 的复杂度(CesiumJS 学习曲线 + Bentley 收购带来的合规变数)只有在跨园区、城市级场景才值得引入。

对 Pivot 的含义

三条路线对应三种客户画像。本课给你一个分层建议

1. 主力路线 = B(后端预转 glTF + xeokit/Three.js)。开源全栈、可私有化、性能可控——契合 Pivot 多租户 SaaS + 国内合规需求。这是 ADR 的默认推荐。

2. A(web-ifc 原生)作为补充,用于"模型预览""编辑交互"等中小模型场景。比如客户上传 IFC 后给个快速预览,再决定要不要正式入库转换。

3. C(APS)几乎排除。除非某客户深度绑定 Revit 且明确接受数据出域,否则不要走商业路线——多租户 SaaS 用 APS 的边际成本和数据治理风险都不划算。

这个三层结构是后续 ADR 的骨架。第五课会展开成完整的候选方案对比表。

检索练习 · 3 道题
1. web-ifc 路线最大的问题是?
2. 路线 B 的预转产物,单建筑场景应选?
3. 哪个不是 APS(路线 C)的陷阱?