Showing Attributes of a GeoJSON data source with labels in Cesium
General
JavaScript
CesiumJS
- loads a geojson file into the scene
- adds LabelCollection and populate the collection with the attributes available in GeoJSON file
loads a geojson file into the scene
adds LabelCollection and populate the collection with the attributes available in GeoJSON file
Description :
Simple Expression :
const entities = dataSource.entities.values;
const labels = viewer.scene.primitives.add(new Cesium.LabelCollection());
for( let i=0 ; i<=entities.length ; i++) {
//...
labels.add({
position : entityposition,
text : entityname,
});
}
Example :
const viewer = new Cesium.Viewer("cesiumContainer");
const promise = Cesium.GeoJsonDataSource.load("../SampleData/simplestyles.geojson");
promise.then(function (dataSource) {
viewer.dataSources.add(dataSource);
//Get the array of entities
const entities = dataSource.entities.values;
const labels = viewer.scene.primitives.add(new Cesium.LabelCollection());
for( let i=0 ; i<=entities.length ; i++) {
const myentity = entities[i];
const pos = myentity.position._value;
const entityposition = new Cesium.Cartesian3(pos.x, pos.y, pos.z);
const entityname = myentity.name;
labels.add({
position : entityposition,
text : entityname,
});
}
})
.catch(function (error) {
//Display any errrors encountered while loading.
window.alert(error);
});
2025 Jan