1. A concise explanation of the problem you’re experiencing.
I’m trying to add label for polyline by editing the entities created with geojsonDataSource.
For polyline, I’m calculating the center of it and set entity.position, then create a label for entity.label. Yet there are too many labels created.
2. A minimal code example. If you’ve found a bug, this helps us reproduce and repair it.
let promise = Cesium.GeoJsonDataSource.load(config.url, {clampToGround: true});
promise.then(dataSource => {
viewer.dataSources.add(dataSource);
dataSource.id = id;
dataSource.name = config.name;
dataSource.show = false;
let entities = dataSource.entities.values;
entities.forEach((entity, idx) => {
let properties = entity.properties.getValue(Cesium.JulianDate.now());
if (entity.billboard) {
entity.billboard = undefined;
createLabel(properties[layerObj.labelKey], 0, entity)
}
if (entity.polyline) {
entity.polyline.distanceDisplayCondition = new Cesium.DistanceDisplayCondition(0, 1e5)
let polyPositions = entity.polyline.positions.getValue();
let polyCenter = Cesium.BoundingSphere.fromPoints(polyPositions).center;
polyCenter = Cesium.Ellipsoid.WGS84.scaleToGeodeticSurface(polyCenter);
entity.position = polyCenter
createLabel(properties[layerObj.labelKey], 2, entity)
entity.polyline.clampToGround = true;
entity.polyline.zIndex = 10;
entity.polyline.width = 2;
// entity.polyline = undefined;
}
if (entity.polygon) {
entity.polygon.distanceDisplayCondition = new Cesium.DistanceDisplayCondition(0, 1e6)
let polyPositions = entity.polygon.hierarchy.getValue(Cesium.JulianDate.now()).positions;
let polyCenter = Cesium.BoundingSphere.fromPoints(polyPositions).center;
polyCenter = Cesium.Ellipsoid.WGS84.scaleToGeodeticSurface(polyCenter);
entity.position = polyCenter;
createLabel(properties[layerObj.labelKey], 1, entity)
let color = Cesium.Color.fromRandom({
alpha : 0.1
});
entity.height = 0;
entity.outline = true;
entity.polygon.material = color;
// entity.polygon.heightReference = Cesium.HeightReference.RELATIVE_TO_GROUND;
// entity.polygon.outlineWidth = 10.0
// entity.polygon = undefined
}
})
dataSource.show = config.show;
if (config.flyTo) flyTo(dataSource, viewer)
}).otherwise(err => {
console.log(err);
})
3. Context. Why do you need to do this? We might know a better way to accomplish your goal.
The use case is to load geojson poi info(each geometry with an label) with geojsonDataSource. The polygon with label works, yet for polyline, since I’m using them for roads, ideally, I would like to dynamically render 1 or 2 label(road name) along the polyline in the viewer.
4. The Cesium version you’re using, your operating system and browser.
Cesium 1.61, mac Mojave 10.14.6, Chrome 77.0.3865.90 64bit
Thank you so much