# Add EntityCollection to viewer

**URL:** <https://community.cesium.com/t/add-entitycollection-to-viewer/2226>\
**Category:** CesiumJS\
**Created:** [March 23, 2015, 6:32pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226 "2015-03-23T18:32:52Z")\
**Posts on this page:** 12\
**Page:** 1

<div class="post-metadata">

**Author:** ![Aaron\_Bird](https://avatars.discourse-cdn.com/v4/letter/a/cab0a1/32.png) [@Aaron\_Bird](https://community.cesium.com/u/Aaron_Bird)\
**Post date:** [March 23, 2015, 6:32pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/1 "2015-03-23T18:32:52Z")

</div>

Hi

I am sure this is a trivial question.

I am adding a number of polylines to an entity collection. I am then having problems adding the collection to the viewer.

var myEntityCollection = new Cesium.EntityCollection;

//In a loop

myEntityCollection.add({

polyline: {

positions: Cesium.Cartesian3.fromDegreesArrayHeights(rte),

width: 2,

material: new Cesium.Color(color[1], color[2], color[3]),

followSurface: true

}

});

console.log(myEntityCollection.values); //I can see the entities have been added

viewer.entities.add(myEntityCollection); //The entities dont show on the globe

Thanks

---

<div class="post-metadata">

**Author:** ![Hyper\_Sonic](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hyper_sonic/32/2255_2.png) [@Hyper\_Sonic](https://community.cesium.com/u/Hyper_Sonic)\
**Post date:** [March 23, 2015, 9:58pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/2 "2015-03-23T21:58:09Z")

</div>

I don’t see any usage examples here

[http://cesiumjs.org/Cesium/Build/Documentation/EntityCollection.html](http://cesiumjs.org/Cesium/Build/Documentation/EntityCollection.html)

I created a test based off the polyline demo, just change the test boolean to test it

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

var myEntityCollection = new Cesium.EntityCollection();  
var test=false;  
if(test){var prefix=myEntityCollection;}  
else{var prefix=viewer.entities;}

var redLine = prefix.add({  
name : ‘Red line on the surface’,  
polyline : {  
positions : Cesium.Cartesian3.fromDegreesArray([-75, 35,  
-125, 35]),  
width : 5,  
material : Cesium.Color.RED  
}  
});

var glowingLine = prefix.add({  
name : ‘Glowing blue line on the surface’,  
polyline : {  
positions : Cesium.Cartesian3.fromDegreesArray([-75, 37,  
-125, 37]),  
width : 10,  
material : new Cesium.PolylineGlowMaterialProperty({  
glowPower : 0.2,  
color : Cesium.Color.BLUE  
})  
}  
});

if(test){viewer.entities.add(myEntityCollection);}

viewer.zoomTo(viewer.entities);

``

---

<div class="post-metadata">

**Author:** ![Aaron\_Bird](https://avatars.discourse-cdn.com/v4/letter/a/cab0a1/32.png) [@Aaron\_Bird](https://community.cesium.com/u/Aaron_Bird)\
**Post date:** [March 24, 2015, 10:45am UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/3 "2015-03-24T10:45:06Z")

</div>

Hi,

Thanks for your reply. I tried running the above code and it never adds the entities to the map when using the entity collection.

I am sure I am missing something basic, so for now will continue to use the viewer.entities.add for every entity I wish to add.

If anyone can provide any points as to why viewer.entities.add(myEntityCollection); doesnt seem to add the collection to the globe, that would be great.

Thanks

---

<div class="post-metadata">

**Author:** ![Hyper\_Sonic](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hyper_sonic/32/2255_2.png) [@Hyper\_Sonic](https://community.cesium.com/u/Hyper_Sonic)\
**Post date:** [March 24, 2015, 11:58am UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/4 "2015-03-24T11:58:18Z")

</div>

It would be nice if the reference docs would link to some SandCastle apps demonstrating the features.

---

<div class="post-metadata">

**Author:** ![Michael\_Lodge-Paoli1](https://avatars.discourse-cdn.com/v4/letter/m/e47774/32.png) [@Michael\_Lodge-Paoli1](https://community.cesium.com/u/Michael_Lodge-Paoli1)\
**Post date:** [March 24, 2015, 4:52pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/5 "2015-03-24T16:52:29Z")

</div>

[https://github.com/NautSoft/angular-cesiumjs/blob/master/angular-cesiumjs.js](https://github.com/NautSoft/angular-cesiumjs/blob/master/angular-cesiumjs.js)

While probably not 100% what you’re looking for check out this module for Angular. I do some Collection management within it.

---

<div class="post-metadata">

**Author:** ![Hyper\_Sonic](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hyper_sonic/32/2255_2.png) [@Hyper\_Sonic](https://community.cesium.com/u/Hyper_Sonic)\
**Post date:** [March 24, 2015, 7:02pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/6 "2015-03-24T19:02:15Z")

</div>

Thanks to Matt’s other post I found some info here

> **[Visualizing Spatial Data | cesium.com](https://cesium.com/blog/2015/02/02/visualizing-spatial-data/)**
>
> We’ve moved the content of this tutorial to the new documentation section of the site, here

Scroll down to where it says “EntityCollection is an associative array that makes managing and monitoring a group of entities easy”

There’s a code snippet there where you copy/paste into

> **[Cesium Sandcastle](https://sandcastle.cesium.com/index.html?src=Geometry%20and%20Appearances.html&label=Showcases)**
>
> The Cesium Sandcastle provides an interactive environment for testing Cesium code.

Add this after the for loop after copy and pasting

console.log(msg);

Maybe the ref docs could link to the Visualizing-Spatial-Data page as it provides a good overview explanation.

---

<div class="post-metadata">

**Author:** ![Aaron\_Bird](https://avatars.discourse-cdn.com/v4/letter/a/cab0a1/32.png) [@Aaron\_Bird](https://community.cesium.com/u/Aaron_Bird)\
**Post date:** [March 24, 2015, 8:49pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/7 "2015-03-24T20:49:38Z")

</div>

Thanks again. I did read this tutorial a few times before posting on the forum. I was still left a little confused.

Is this the code snippet you refer to?

```auto
function onChanged(collection, added, removed, changed){
  var msg = 'Added ids';
  for(var i = 0; i < added.length; i++) {
    msg += '\n' + added[i].id;
  }
}
viewer.entities.collectionChanged.addEventListener(onChanged);

```

I added this in sandbox but could not get it to work. I also was unsure how this would work with the myEnityCollection example I posted earlier.

Thanks

---

<div class="post-metadata">

**Author:** ![Hyper\_Sonic](https://sea2.discourse-cdn.com/cesium/user_avatar/community.cesium.com/hyper_sonic/32/2255_2.png) [@Hyper\_Sonic](https://community.cesium.com/u/Hyper_Sonic)\
**Post date:** [March 24, 2015, 9:20pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/8 "2015-03-24T21:20:24Z")

</div>

Ya that code snippet builds up a msg string but doesn’t seem to output it to the console, that’s why I added console.log(msg).

I don’t think viewer.entities.add(myEntityCollection); is a valid statement, even though it doesn’t throw any errors. I believe you need to use viewer.entities.add to add each entity to the scene. I think entityCollection is intended to keep track of a group of entities, but not to add them as a whole group to the scene. I believe entityCollection is an array of unique ids that refer to entity objects, rather than an array of entities objects themselves.

Looking at Michaels example it seems that for primitives you can add collections, but I could be wrong.

---

<div class="post-metadata">

**Author:** ![Michael\_Lodge-Paoli1](https://avatars.discourse-cdn.com/v4/letter/m/e47774/32.png) [@Michael\_Lodge-Paoli1](https://community.cesium.com/u/Michael_Lodge-Paoli1)\
**Post date:** [March 25, 2015, 10:53pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/9 "2015-03-25T22:53:49Z")

</div>

Gah… so the problem is actually simple… viewer.entities is a “getter” only property. You cannot assign a new collection on top of it.

So myEntityCollection = viewer.entities; then you can add all your entities to that collection.

If you need to have separate collections then you will probably need to do something similar to what I did.

---

<div class="post-metadata">

**Author:** ![Alex\_K](https://avatars.discourse-cdn.com/v4/letter/a/5fc32e/32.png) [@Alex\_K](https://community.cesium.com/u/Alex_K)\
**Post date:** [May 13, 2015, 7:06pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/10 "2015-05-13T19:06:29Z")

</div>

well, just for those messing with the same s\*\*t and wandered here like I did — look at CustomDataSource section at cesium docs. have no idea, why such a logically desired feature is not described well while it's relatively convoluted implemented, but God bless it nevertheless exists

---

<div class="post-metadata">

**Author:** ![thomashastings1](https://avatars.discourse-cdn.com/v4/letter/t/c37758/32.png) [@thomashastings1](https://community.cesium.com/u/thomashastings1)\
**Post date:** [November 17, 2015, 4:53am UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/11 "2015-11-17T04:53:55Z")

</div>

Did you ever find a solution?

---

<div class="post-metadata">

**Author:** ![Terry\_Brown1](https://avatars.discourse-cdn.com/v4/letter/t/7993a0/32.png) [@Terry\_Brown1](https://community.cesium.com/u/Terry_Brown1)\
**Post date:** [August 18, 2016, 4:53pm UTC](https://community.cesium.com/t/add-entitycollection-to-viewer/2226/12 "2016-08-18T16:53:44Z")

</div>

Expanding 🙂 Alex K’s answer:

> 

myDataSource = new Cesium.CustomDataSource(“my data”)

myDataSource.entities.add()  
// repeat as needed

viewer.dataSources.add(myDataSource)

``

so you don’t create an EntityCollection, you create a CustomDataSource which comes with an EntityCollection.