Animate Polyline from source coordinates to destination coordinates

CesiumJS
1

Hi everyone,

I need help to animate a polyline that I have created with the source and destination coordinates - Something similar to Norse Live Attack Maps:

Here is the code that I've created for the polyline. Right now, it is just displaying a line without any animation like the Norse.

var pointNew = viewer.entities.add({
    name: (sourceCountry + " - " + destCountry),
    polyline : {
  positions: Cesium.Cartesian3.fromDegreesArrayHeights([103.989, 1.3592, 40.0, 73.0969, 49.8119, 40.0]),
        width : 5,
  material : Cesium.Color.YELLOW
    }
});

Any help would be much appreciated!

2

Hello,

We don’t have support for that kind of animation out of the box, but you can compute the start and end points of the polyline and update them to only show a segment of it at a time.

See this forum post for an example of how to use a CallbackProperty to animate a polyline by changing the positions:

https://groups.google.com/forum/#!searchin/cesium-dev/rubberband/cesium-dev/3zHCkexUFc4/DKpjjHbJBQAJ

Hope this helps!

Hannah