Render large amount of entities

I am trying to visualize ~19000 entities on the Cesium widget in order to render the buildings of a city.

I have the coordinates of the perimeter of every building in the city and I generate a different polygon and put it on the map.

The problem I am facing is the following: whenever the number of buildings to render is quite high (around 1000) Cesium starts lagging and after a while WebGL completely crashes and this error box from Cesium appears:

An error occurred while rendering. Rendering has stopped.
TypeError: Failed to execute 'shaderSource' on 'WebGLRenderingContext': parameter 1 is not of type 'WebGLShader'.
TypeError: Failed to execute 'shaderSource' on 'WebGLRenderingContext': parameter 1 is not of type 'WebGLShader'.
    at p (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:475:9438)
    at v (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:475:12575)
    at c._bind (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:475:13590)
    at V (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:497:5280)
    at L.draw (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:497:8769)
    at n.execute (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:474:15256)
    at h.execute (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:496:9324)
    at i.execute (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:496:7838)
    at ke (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:508:17491)
    at We (http://localhost:8080/Cesium/Build/Cesium/Cesium.js:508:21479)

This is my code:

var buildings = new Cesium.CustomDataSource();
               url: SERVER_URL + "/building/max=46.061271,8.875321&min=45.940576,8.996019/", //COORDINATES TO GET BUILDINGS
               type: "GET",
               success: function (data) {
                   for (var i = 0; i < data.length; i++) {
                       if (data[i]) {
                           var list = createList(data[i].ringGlobalCoords);
                           var height = (data[i].floors + 2) * 2;

                                             id: 'building_' + data[i].id,
                                             name: 'edificio',
                                             description: 'edificio desc',
                                             polygon: {
                                                 hierarchy: Cesium.Cartesian3.fromDegreesArray(list),
                                                 height: data[i].altitude,
                                                 extrudedHeight: (data[i].floors + 2) * 2,
                                                 material: Cesium.Color.WHITE,
                                                 outline: false,
                                                 closeTop: true,
                                                 closeBottom: false,
                                                 distanceDisplayCondition: new Cesium.DistanceDisplayCondition(0, 15000.0)

Do you have any idea how could I solve this problem or optimize the rendering of the buildings?

Thank you,

Hi Andrea,

For that much data, I would point you to 3d-tiles. See this forum discussion for details:

3d-tiles should handle it!


  • Rachel

Hi Rachel,

thank you for your answer. I have a question, though.

In order to render the entities, I have an array of coordinates that generates the perimeter of every 3d polygon and then I set the height.
As far as I understood from the 3D-tiles documentation, I would need a 3d tileset. Am I right?

Since I only have coordinates, how could I procede in this case?

I am looking forward to hearing from you.


Hello Andrea,

Yes, you would need to build a 3d tileset from the data you have. Right now, I don’t know of any tools to help you do this.

However, we have been working on a new website that will have services to help you process your data into 3D Tiles. Learn more information at