Cesium entities(cylinders) are flickering on position change

CesiumJS
1

Hey,
I have some cylinders flying around the globe, I am recieving the data from a server every second and updating the cylinder's modelMatrix and position properties.
But, in every update, the cylinder flickers.
Is there a way to avoid the flickering ?
I have read about the callback property, tried using it unsuccessfully with the PositionProperty implementations.
I would really appericiate any examples on how it should be done, and if there is a way to "fade" the position change (make it smooth).

This is how I construct the cylinder right now :

            var cone = new Cesium.Entity({
                position: origin,
                cylinder: {
                    length: geoItemModels[i].Height,
                    topRadius: 0.0,
                    bottomRadius: radius,
                    material: Cesium.Color.RED.withAlpha(0.3)
                }
            });
And the position \ modelMatrix updates (they are beeing calculated few lines before) :
            
            conesDic[key].modelMatrix = modelMatrix;
            conesDic[id].position = origin;

Thank you very much

2

Hello,

Using a callback property is the way to go. It forces the geometry to be drawn synchronously, so you don’t see that flickering.

Here is an example:

var viewer = new Cesium.Viewer(‘cesiumContainer’);

var lon = -100;
function newPosition() {
lon += 0.05;
return Cesium.Cartesian3.fromDegrees(lon, 40.0, 200000.0);
}
var greenCylinder = viewer.entities.add({
position: new Cesium.CallbackProperty(newPosition, false),
cylinder : {
length : 400000.0,
topRadius : 200000.0,
bottomRadius : 200000.0,
material : Cesium.Color.GREEN,
}
});

``

Best,

Hannah

3

Thank you, with some changes it did the trick, but now something odd happens.
You can see the behaviour in the following picture :
https://s12.postimg.org/5ys1h2bql/odd_Cone.png

The brighter parts in the picture are going crazy, rotating and flickering while the cone moves.
Would appericiate any help :slight_smile:

The cone is beeing constructed as follow :

                var cone = new Cesium.Entity({
                    position: new Cesium.CallbackProperty(function () {
                        return globalPositioningDictionary[Id];
                    }, false),
                    cylinder: {
                    length: geoItemModels[i].Height,
                    topRadius: 0.0,
                    bottomRadius: radius,
                    material: Cesium.Color.RED.withAlpha(0.3)
                }
});

Thanks again

4

That’s odd. Could you give me a some sample data to recreate the problem?
Thanks!

Hannah