我是?www.v2ex.com/t/1151549 的作者,在csdn這邊補全一些更多的信息
相關工具
主項目插件版本: "cesium": "^1.131.0",、"resium": "^1.19.0-beta.1"、"three": "^0.178.0"、"react": "^19.1.0"、"3d-tiles-renderer": "^0.4.13"
用ai寫的給glb的頂點屬性增加_BATCHID的腳本的插件依賴:?"@gltf-transform/core": "^4.2.1","@gltf-transform/extensions": "^4.2.1"
npm版的非官方的那個3d-tiles-tools的版本: 1.0.0
官方3d-tiles-tools源碼的版本"name": "3d-tiles-tools","version": "0.5.0",
失敗的glb模型路線
最近有單子搞 web3d ,有個明確的需求是對"一個由多個模型組成的大模型"進行子模型級別的交互并更改材質顏色。這個需求原本和團隊里人聊的很嗨,感覺實現很容易,實際上我(+ai )硬磨了 3 天半后,發現 resium 的 Entiy 、Model 都不行,感覺卡的夠久了,就不再試試 Primitive 了,開始回頭復盤哪里出了問題——blender 導出的 glb 模型,resium 倒是能拿到 node ,但很多都是不公開的變量,雖然 console 能打印,但我這邊調研的定論是"cesium 不能對 glb 模型進行 node 級別的材質顏色修改",賦值能賦值成功,scene 重渲染就是不生效。
我這邊為了防止自己對 ai 誘導型提問,豆包、通義靈碼、gpt 三個混著用,第三天才想起來重新提問了大方向,明確了下一個調研方向.b3dm 的 3dtiles 。
3dtiles和.b3dm
讓 gpt 寫 @gltf-transform/core 的腳本失敗率好高,總之基于 @gltf-transform/core 整了個腳本(這個是成功的),給 glb 的每個頂點屬性加上"_BATCHID"。 用 3d-tiles-tools analyze (不是 cesium 官方的那個 3d-tiles-tools, 這里的是個 npm 包)驗證了一下這個修改后的 glb 確實有了_BATCHID,下一步是把這個有 batchid 的 glb 做成有 batchTable 和 featureTable 的的.b3dm 。我嘗試了一天一夜最終放棄了“讓 ai 基于 @gltf-transform 去寫上述要求的 glb 轉.b3dm 方法”。下載了 cesium 官方的 3d-tiles-tools 源碼, 用 src/tilesets/tileFormats/TileFormats 的 createB3dmTileDataFromGlb 方法搞了個腳本,成功做出了符合要求的.b3dm 。這個.b3dm 我 analyze 出來后的 xxx.batchTable.json 、xxx.featureTable.json 都是有正確的值的。對了,有個在線分析 glb 是否合規的,是?glTF Validator?,再加上官方的 3d-tiles-tools 能確保 ai 不會搗亂出非法的 glb 、.b3dm (走了很多彎路,我真信了 ai 給我搓了個驗證腳本,迭代了半天然后放棄了)。tileset.json 的話,我這波調研是能跑就行,用 3d-tiles-tools 隨便生成了一個,坐標什么的我自己在 resium 里用代碼矯正。最終,我用 resium 的 Cesium3DTileset 接入這個 3dtiles 后,成功 pick 到了一個 Cesium3DTileFeature 對象,pickedObject.getProperty('name')也有值了,可以通過 tile 的 Cesium3DTileStyle 批處理改材質顏色了。