Adding a GLTF file from JSON.

CesiumJS
1

I have a server with a GLTF file that is kind of big (7mb)
I am loading it on the app start, and plan to display it in Cesium after the map is loaded:

this.viewer.scene.primitives.add(

new Cesium.Model({

gltf: model.data,

modelMatrix: Cesium.Transforms.eastNorthUpToFixedFrame(Cesium.Ellipsoid.WGS84.cartographicToCartesian(model.position)),

scale : 200.0

})

);

**The data I pass look like this => (watch attachment)

Screenshot_2.png
Screenshot_2.png637×593 15.6 KB

1 Like
2

I would try with a smaller glTF file just to see if the issue is the size or something is wrong with the format/loading/parsing.

You can also try loading your glTF into this viewer to verify that it’s valid: https://gltf-viewer.donmccurdy.com/

3

Thank you Omar, I tried smaller models, it actually, work, so I went back and apparently the scale was still to small (it’s wierd cause when I
load the same json but from a gltf, the scale was good).

4

Can you guys share sample best practice of using glTF?

5

@Baris_Sarac Check out our 3D Models Sandcastle for some examples loading gltf files with the viewer’s entity collection. You can also load gltf models directly from urls using the Model.fromGltfAsync function.

If you have more questions in the future please feel fee to start a new thread

1 Like
6

For anyone looking for a sample code below works given plane.glb is in public folder:

          model: {
            uri: "/plane.glb",
            minimumPixelSize: 128,
            maximumScale: 20000,
          },
7

With older CesiumJS versions you could load from a string or from a file.
Now it’s only possible from a file so here is my workaround to still be able load it from string.

From the server you load your .glb file contents then base64 encode it. Then in javascript you base64 decode it. Still a string so you create a blob.
Because it’s now a blob, CesiumJS sees it as a file, problem solved!