# Question about rendering label for linestring

**URL:** <https://community.cesium.com/t/question-about-rendering-label-for-linestring/8728>\
**Category:** CesiumJS\
**Created:** [October 7, 2019, 3:33am UTC](https://community.cesium.com/t/question-about-rendering-label-for-linestring/8728 "2019-10-07T03:33:01Z")\
**Posts on this page:** 1\
**Page:** 1

<div class="post-metadata">

**Author:** ![jiayinshensjsu](https://avatars.discourse-cdn.com/v4/letter/j/e19adc/32.png) [@jiayinshensjsu](https://community.cesium.com/u/jiayinshensjsu)\
**Post date:** [October 7, 2019, 3:33am UTC](https://community.cesium.com/t/question-about-rendering-label-for-linestring/8728/1 "2019-10-07T03:33:01Z")

</div>

**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.

![1570418822585.jpg](https://global.discourse-cdn.com/cesium/original/1X/e65d998769862332e01dc9cca25dcb1231bc8570.jpeg)

**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