Events to track bulk polygon loading / triangulation complete

CesiumJS
1

I am loading a lot of GeoJSON data into my CesiumJS map via the GeoJsonDataSource abstraction:

let ds = await GeoJsonDataSource.load(f)
await this.viewer.dataSources.add(ds)

This operation is timed, and it takes about 2000ms (2.0s) to perform the operations shown above. Clearly some amount of computation is being performed here to take up so much time.

However, the map is generally designed to perform any heavy computation operations in the background; usually via the use of WebWorkers (ES6Workers). My GeoJSON is entirely comprised of Polygon type primitives. Somewhere, the library is using earcut to triangulate all of those polygons into something that can be rendered in a 3D OpenGL scene. That triangulation operation should be quite heavy/time consuming.

After the the initial globe display first loads, it takes another 15-20s for my geometry to also be ready to display. I just need a way to await the complete loading of the custom geometry, such that an event fires when the geometry is actually ready to display (e.g. when the workers finish loading and pre-processing it all)

2

This is certainly something that can be improved in CesiumJS. An obtuse, but correct way to check for this would be the value of viewer.clockViewModel.canAnimate. If it’s true, then all geometry is loaded. If it’s false, then it can’t. You can wrap this in a postRender resolve callback

await new Promise((resolve) => {
  const removeEvent = viewer.scene.postRender.addEventListener(() => {
    if (viewer.clockViewModel.canAnimate) {
      removeEvent();
      resolve();
    }
  });
});

I added it to one of the geometry Sandcastles to show an example

I also will add a link back to this post and a note to the GitHub issue that exists for addressing this: Scene ready event · Issue #4422 · CesiumGS/cesium · GitHub

1 Like