CesiumGS / CesiumGS/cesium

Sluggishness when adding polylines

Open
#3,740 5 comments 0 reactions 0 assignees View on GitHub
category - polyline onramping type - bug
Dominant language
JavaScript
Stars
15.7k
Forks
3.9k
Avg merge
4d 6h
Merged PRs (30d)
34

Description

I've compared three ways of adding polylines to Cesium to try and narrow down why adding polylines slows down Cesium in a few cases.
## One

Adding polylines using `viewer.entities.add`. From the `.gif` below you can see that there is a slowdown (Cesium freezes up) when adding the polylines. After the first few polylines added the slowdown becomes very, very small, but it's still noticeable.

![addpolylineone](https://cloud.githubusercontent.com/assets/11602092/13932075/d85d34c4-ef7c-11e5-8fe5-1055f7e91013.gif)

``` javascript
viewer.entities.add({
polyline : {
positions : [cartesian, Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude + 9.5)],
width : 2
}
});
```

[Full code](https://gist.github.com/TomPed/5e61a4a997919545e299)
## Two

Adding polylines using `viewer.entities.add`, however, I am using a `CallbackProperty` for the polyline's position. From the `.gif` below you can see there is no slowdown at all.

![addpolylinetwo](https://cloud.githubusercontent.com/assets/11602092/13932080/dbb542c4-ef7c-11e5-8c76-ee90a915cfe0.gif)

``` javascript
viewer.entities.add({
polyline : {
positions : new Cesium.CallbackProperty(function() {
return [cartesian, Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude + 9.5)];
}, false),
width : 2
}
});
```

[Full code](https://gist.github.com/TomPed/3e667a02ec1508dc2019)
## Three

Adding polylines using Cesium geometries and `Primitive`. From the `.gif` below you might not be able to tell but the first polyline added takes a few milliseconds to get added (Cesium does not freeze up like in the first way of adding polylines). After the first polyline there are no more slowdowns.

![addpolylinethree](https://cloud.githubusercontent.com/assets/11602092/13932084/e04abfe4-ef7c-11e5-8b83-57d80e80b024.gif)

``` javascript
scene.primitives.add(new Cesium.Primitive({
geometryInstances : new Cesium.GeometryInstance({
geometry : new Cesium.PolylineGeometry({
positions : [cartesian, Cesium.Cartesian3.fromDegrees(longitude, latitude, altitude + 9.5)],
width : 2.0,
vertexFormat : Cesium.PolylineColorAppearance.VERTEX_FORMAT,
followSurface: false
}),
attributes: {
color: Cesium.ColorGeometryInstanceAttribute.fromColor(Cesium.Color.WHITE)
}
}),
appearance : new Cesium.PolylineColorAppearance()
}));
```

[Full code](https://gist.github.com/TomPed/95215cf0fdcf27a4eb70)

Contributor guide

Open the contributing guide

Research direction

Reproduce the three approaches shown in the issue: viewer.entities.add with plain positions, viewer.entities.add with CallbackProperty, and scene.primitives.add with PolylineGeometry. Compare their entity and primitive update paths to identify why direct polyline additions freeze, then verify the fix by repeating the examples and confirming that adding multiple polylines no longer causes the reported slowdown.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
computer-graphics, performance
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
35/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.