Bulk inserting entities

I’m now inserting around 10,000-20,000 entities on screen load and it seems to hold the whole app until the data loads on the map.

Is there a smart way to load a bulk of data without this UI hang?

Are you using suspendEvents/resumeEvents as discussed in this tutorial: http://cesiumjs.org/2015/02/02/Visualizing-Spatial-Data/

Also, what kind of visualization are you creating? Are they all billboards?

Thanks for this suspend/resume events. Can’t tell how I’ve missed this one. Would test it next week when in office.

Regarding the data - all of my entities are billboards+label+polygon.

Should I seperate them?

No reason to separate them, I was just trying to figure out at what level the issue might be; but if you aren’t using suspend/resume events, that’s probably it.

I’ve tried the suspend/resume method, but it had no effect…

I’m still seeing the lag on my UI when the insert starts.

It seems that the “for” loop itself is taking the toll.

All I do is iterate over my data, and add the entities, which takes a few seconds for some reason (in which the system lags).

Is adding an entity such time consuming?

I revive this issue again.
I attach a sandcastle demo file that shows how fast the UI hangs.

Any best practices to solve this issue?

addAndUpdateEntitiesLimit10000.html (4.17 KB)

What exactly are you trying to do? It’s impossible to make any real recommendations without understanding the overall use case. The code as written is incredibly inefficient, both because of your addEntity function and because you are splitting up your entity creation (you should just be bulk inserting everything at once). Is your app actually getting data in batches like this?


  1. How would you update the entity once it is created?
  2. My data arrives in one big bulk on startup and then smaller updates once per second or so (I simulate them as interval here). Any suggestion here?
  1. You get the entity from the collection and assign new values. This is discussed in the Visualizing Spatial Data tutorial. There’s a lot of other good information in there as well, so I highly recommend you go through the whole thing.
  1. I would load it all at once on startup, for the smaller updates, I would be sure to only values that have actually changed. Resetting the same value does a lot of needless work that negatively affects performance.

There may still be performance issues depending on what your exact use case is, since dynamic ellipses need to be recalculated every time they change, which is CPU intensive.

Thanks. In my app I do the updates per changed attr, so it is indeed faster.
Regarding ellipses - would it be better to use a polygon and plot it as an ellipse? Would it be better this way with fast changing dynamic data?

Ellipses should be faster than polygons.You can set the EllipseGraphics.granularity to a higher value than the default to trade off some accuracy for faster computation. Computing geometry is fairly CPU intensive, so if you have lots of ellipses changing all of the time, I’m not sure what kind of performance you’ll get.

I will mention that if your data is actually dynamic, you might want to consider using a CallbackProperty or SampledProperty for the ellipse values so that they are treated separately from static data. Which will further improve performance (but it really depends on your exact use cases and how often things are changing. There’s lots of room for optimizations in this area of the Cesium code.

Well… this is quite a nice feature… Cesium just keeps surprising for the better :slight_smile:

Here’s my code using this feature:

var viewer = new Cesium.Viewer(‘cesiumContainer’);

var date = new Date();

var jDate = new Cesium.JulianDate.fromDate(date);

var nextJDate = new Cesium.JulianDate.fromDate(new Date(date.getTime() + 5*1000));

//Create a color sampled property

var colorProperty = new Cesium.SampledProperty(Cesium.Color);

colorProperty.forwardExtrapolationType = Cesium.ExtrapolationType.HOLD;

//Populate it with data

colorProperty.addSample(jDate, new Cesium.Color(0, 0, 0));

colorProperty.addSample(nextJDate, new Cesium.Color(1, 1, 1));

// create a position Cartesian3 property

var positionProperty = new Cesium.SampledProperty(Cesium.Cartesian3);

positionProperty.forwardExtrapolationType = Cesium.ExtrapolationType.HOLD;

//Populate it with data

for (var i = 0; i<6; i++){

nextJDate = new Cesium.JulianDate.fromDate(new Date(date.getTime()+i*1000));

positionProperty.addSample(nextJDate , new Cesium.Cartesian3.fromDegrees(-103.0+i, 40.0-i));


var redEllipse = viewer.entities.add({

position: positionProperty,

name : 'Red ellipse on surface with outline',

ellipse : {

    semiMinorAxis : 250000.0,

    semiMajorAxis : 400000.0,

    material : Cesium.Color.RED.withAlpha(0.5),

    outline : true,

    outlineColor : colorProperty




From what I figure, it’s supposed to move the ellipse for 5 seconds. It’s also supposed to change the outline color after 5 seconds. This code, running in the sandcastle, does the following:

Changes the outline color after 3 seconds - why does this happen and not 5 seconds after onset, as I would expect? Or is it a processing issue?

Another issue is this: if I try to set colorProperty to "material", it
throws an error.
I couldn't figure how to use this for material. Any example available?