The remaining code just adds some additional visualization options. Similar to our previous interactions with HTML elements, we can attach listener functions to toggle shadows and neighborhood polygon visibility.

Let’s start by creating a simple method to toggle the neighborhood polygons. In general, we can hide an entity by setting visibility with Entity.show. However, this only sets visibility for a single entity, and we want to hide or show all neighborhood entities at once.

We can achieve this by adding all neighborhood entities to a parent entity, as shown in this example, or simply by using the show property of the EntityCollection. Then we can set visibility for all child entities at once by changing neighborhoods.show.

1
2
3
4
5

var neighborhoodsElement =  document.getElementById('neighborhoods');

neighborhoodsElement.addEventListener('change', function (e) {
    neighborhoods.show = e.target.checked;
});

We can do something similar to toggle shadow visibility:

1
2
3
4
5

var shadowsElement = document.getElementById('shadows');

shadowsElement.addEventListener('change', function (e) {
    viewer.shadows = e.target.checked;
});

Finally, since 3D Tiles may not load immediately, we can also add a loading indicator that is only removed when the tileset has finished loading (and therefore the promise has resolved).

Cesium Chinese Community QQ Group: 807482793

Original link: http://cesiumcn.org/topic/166.html | China fast access: http://cesium.coinidea.com/topic/166.html