extend Devtools Network tab to display B3DM as thumbnails

CesiumJS
1

1. A concise explanation of the problem you're experiencing.

Investigating 3DTiles Optimisation,
Trying to see *exactly* what 3d-tiles are loaded when I move somewhere in our 3D model, after some parameters are changed.
am investigating a ChromeDevTools Network extension that list b3dm URLs and their thumbnails (Webp/jpeg)

Trying to extend Devtools Network tab to display B3DM as thumbnails

2. A minimal code example. If you've found a bug, this helps us reproduce and repair it.

3. Context. Why do you need to do this? We might know a better way to accomplish your goal.

Trying to tweak/come up with a better way to load our textured B3DM tiles. We have tall model, with *a lot* of textures, similar to the attached tall.png, with 10x textures inside the building.

4. The Cesium version you're using, your operating system and browser.
v1.58

tall.jpg
tall.jpg993×1561 552 KB

2

The question is, do i need to hook into Cesium to render that B3DM tile ?
What is the easiest way to do this?

3

This sounds like it would be pretty useful! Typically the way I’ve debugged this is to filter Chrome network requests by “.b3dm”. A B3dm file is just a packaged binary glTF (also known as glb).

We do have an open source tool to unpack a b3dm to a glb: https://github.com/AnalyticalGraphicsInc/3d-tiles-tools/tree/master/tools#b3dmtoglb, and you can convert a glb to gltf with gltf-pipeline: https://github.com/AnalyticalGraphicsInc/gltf-pipeline, and from there you can find any gltf viewer to see it.

This would be a really useful tool for the community and ecosystem! I’d love to see it if you get it to work. The other thing you can use or might find helpful is the 3D Tiles inspector in CesiumJS which might be a good example since it grabs a lot of debug info about tiles: https://cesiumjs.org/Cesium/Apps/Sandcastle/index.html?src=3D%20Tiles%20Inspector.html