Search code examples
cesiumjs

How to use Ceisum EntityCollection


I am trying to use Cesium.EntityCollecion to manage some Entity Object. But it can't show on Earth.

Here is my code:

const viewer = new Cesium.Viewer("cesiumContainer");
const collection = new Cesium.EntityCollection();
viewer.entities.add(collection);
collection.add({
    id: 1,
    position: Cesium.Cartesian3.fromDegrees(118.0, 35.0),
    point: {
        pixelSize: 100,
        color: Cesium.Color.RED,
    },
});

Is that problem caused by viewer.entities.add(collection)? Cesium version is 1.109.

If I use:

viewer.entities.add({
    id: 1,
    position: Cesium.Cartesian3.fromDegrees(118.0, 35.0),
    point: {
        pixelSize: 100,
        color: Cesium.Color.RED,
    },
});

this entity can show up correctly, but I need to manage different group of entities.


Solution

  • Yes, that is the real problem.
    You have to add an instance of Entity into the viewer.entities.
    To manage different group of entities, you can use CustomDataSource.
    Below is sample code.

    const { Cartesian3, CustomDataSource, Viewer } = Cesium;
    
    const viewer = new Viewer("cesiumContainer");
    
    const group1 = new CustomDataSource("group1");
    const group2 = new CustomDataSource("group2");
    
    viewer.dataSources.add(group1);
    viewer.dataSources.add(group2);
    
    group1.entities.add({
        id: 1,
        position: Cartesian3.fromDegrees(118.0, 35.0),
        point: {
            pixelSize: 100,
            color: Cesium.Color.RED
        }
    });
    
    group2.entities.add({
        id: 1,
        position: Cartesian3.fromDegrees(140.0, 35.0),
        point: {
            pixelSize: 100,
            color: Cesium.Color.BLUE
        }
    });