Fixes #3945: Flickering when adding a new polygon entity

CHANGES.md

@@ -8,10 +8,10 @@ Change Log
 * Fixed glTF support to handle meshes with and without tangent vectors, and with/without morph targets, sharing one material. [#6421](https://github.com/AnalyticalGraphicsInc/cesium/pull/6421)
 * Fixed glTF support to handle skinned meshes when no skin is supplied. [#6061](https://github.com/AnalyticalGraphicsInc/cesium/issues/6061)
 * Allow loadWithXhr to work with string URLs in a web worker.
-* `GroundPrimitive`s and `ClassificationPrimitive`s will become ready when `show` is `false`. [#6428](https://github.com/AnalyticalGraphicsInc/cesium/pull/6428) 
+* `GroundPrimitive`s and `ClassificationPrimitive`s will become ready when `show` is `false`. [#6428](https://github.com/AnalyticalGraphicsInc/cesium/pull/6428)
 * Fix Firefox WebGL console warnings. [#5912](https://github.com/AnalyticalGraphicsInc/cesium/issues/5912)
 * Fix parsing Cesium.js in older browsers that do not support all TypedArray types. [#6396](https://github.com/AnalyticalGraphicsInc/cesium/pull/6396)
-
+* Fix flicker when adding, removing, or modifiying entities. [#3945](https://github.com/AnalyticalGraphicsInc/cesium/issues/3945)
 ##### Additions :tada:
 * Improved `MapboxImageryProvider` performance by 300% via `tiles.mapbox.com` subdomain switching. [#6426](https://github.com/AnalyticalGraphicsInc/cesium/issues/6426)
 

CONTRIBUTORS.md

@@ -102,6 +102,8 @@ See [CONTRIBUTING.md](CONTRIBUTING.md) for details on how to contribute to Cesiu
    * [Natanael Rivera](https://github.com/nrivera-Novetta/)
    * [Justin Burr](https://github.com/jburr-nc/)
    * [Jeremy Marzano](https://github.com/JeremyMarzano-ISPA/)
+* [Orbit Logic](http://www.orbitlogic.com)
+   * [Roderick Green](https://github.com/roderickgreen/)
 
 ## [Individual CLA](Documentation/Contributors/CLAs/individual-cla-agi-v1.0.txt)
 * [Victor Berchet](https://github.com/vicb)

Source/DataSources/StaticGeometryColorBatch.js

@@ -156,6 +156,7 @@ define([
                 }
 
                 primitive = new Primitive({
+                    show : false,
                     asynchronous : true,
                     geometryInstances : geometries,
                     appearance : new this.appearanceType({
@@ -184,6 +185,7 @@ define([
             this.createPrimitive = false;
             this.waitingOnCreate = true;
         } else if (defined(primitive) && primitive.ready) {
+            primitive.show = true;
             if (defined(this.oldPrimitive)) {
                 primitives.remove(this.oldPrimitive);
                 this.oldPrimitive = undefined;

Source/DataSources/StaticGeometryPerMaterialBatch.js

@@ -153,6 +153,7 @@ define([
                 }
 
                 primitive = new Primitive({
+                    show : false,
                     asynchronous : true,
                     geometryInstances : geometries,
                     appearance : new this.appearanceType({
@@ -182,6 +183,7 @@ define([
             this.primitive = primitive;
             this.createPrimitive = false;
         } else if (defined(primitive) && primitive.ready) {
+            primitive.show = true;
             if (defined(this.oldPrimitive)) {
                 primitives.remove(this.oldPrimitive);
                 this.oldPrimitive = undefined;

Source/DataSources/StaticGroundGeometryColorBatch.js

@@ -111,6 +111,7 @@ define([
                 }
 
                 primitive = new GroundPrimitive({
+                    show : false,
                     asynchronous : true,
                     geometryInstances : geometries,
                     classificationType : this.classificationType
@@ -134,6 +135,7 @@ define([
             this.createPrimitive = false;
             this.waitingOnCreate = true;
         } else if (defined(primitive) && primitive.ready) {
+            primitive.show = true;
             if (defined(this.oldPrimitive)) {
                 primitives.remove(this.oldPrimitive);
                 this.oldPrimitive = undefined;

Source/DataSources/StaticOutlineGeometryBatch.js

@@ -111,6 +111,7 @@ define([
                 }
 
                 primitive = new Primitive({
+                    show : false,
                     asynchronous : true,
                     geometryInstances : geometries,
                     appearance : new PerInstanceColorAppearance({
@@ -142,6 +143,7 @@ define([
             this.createPrimitive = false;
             this.waitingOnCreate = true;
         } else if (defined(primitive) && primitive.ready) {
+            primitive.show = true;
             if (defined(this.oldPrimitive)) {
                 primitives.remove(this.oldPrimitive);
                 this.oldPrimitive = undefined;

Specs/DataSources/StaticGeometryColorBatchSpec.js

@@ -274,4 +274,66 @@ defineSuite([
             batch.removeAllPrimitives();
         });
     });
+
+    it('shows only one primitive while rebuilding primitive', function() {
+        var batch = new StaticGeometryColorBatch(scene.primitives, PerInstanceColorAppearance, undefined, false, ShadowMode.DISABLED);
+
+        function buildEntity() {
+            return new Entity({
+                position : new Cartesian3(1234, 5678, 9101112),
+                ellipse : {
+                    semiMajorAxis : 2,
+                    semiMinorAxis : 1,
+                    material : Color.RED.withAlpha(0.5),
+                    height : 0
+                }
+            });
+        }
+
+        function renderScene() {
+            scene.initializeFrame();
+            var isUpdated = batch.update(time);
+            scene.render(time);
+            return isUpdated;
+        }
+
+        var entity1 = buildEntity();
+        var entity2 = buildEntity();
+
+        var updater1 = new EllipseGeometryUpdater(entity1, scene);
+        var updater2 = new EllipseGeometryUpdater(entity2, scene);
+
+        batch.add(time, updater1);
+        return pollToPromise(renderScene)
+        .then(function() {
+            expect(scene.primitives.length).toEqual(1);
+            var primitive = scene.primitives.get(0);
+            expect(primitive.show).toBeTruthy();
+        })
+        .then(function() {
+            batch.add(time, updater2);
+        })
+        .then(function() {
+            return pollToPromise(function() {
+                renderScene();
+                return scene.primitives.length === 2;
+            });
+        })
+        .then(function() {
+            var showCount = 0;
+            expect(scene.primitives.length).toEqual(2);
+            showCount += !!scene.primitives.get(0).show;
+            showCount += !!scene.primitives.get(1).show;
+            expect(showCount).toEqual(1);
+        })
+        .then(function() {
+            return pollToPromise(renderScene);
+        })
+        .then(function() {
+            expect(scene.primitives.length).toEqual(1);
+            var primitive = scene.primitives.get(0);
+            expect(primitive.show).toBeTruthy();
+            batch.removeAllPrimitives();
+        });
+    });
 });

Specs/DataSources/StaticGeometryPerMaterialBatchSpec.js

@@ -1,5 +1,6 @@
 defineSuite([
         'DataSources/StaticGeometryPerMaterialBatch',
+        'Core/Cartesian2',
         'Core/Cartesian3',
         'Core/Color',
         'Core/DistanceDisplayCondition',
@@ -26,6 +27,7 @@ defineSuite([
         'Specs/pollToPromise'
     ], function(
         StaticGeometryPerMaterialBatch,
+        Cartesian2,
         Cartesian3,
         Color,
         DistanceDisplayCondition,
@@ -240,4 +242,74 @@ defineSuite([
             batch.removeAllPrimitives();
         });
     });
+
+    it('shows only one primitive while rebuilding primitive', function() {
+        var batch = new StaticGeometryPerMaterialBatch(scene.primitives, MaterialAppearance, undefined, false, ShadowMode.DISABLED);
+
+        function buildEntity() {
+            var material = new GridMaterialProperty({
+                color : Color.YELLOW,
+                cellAlpha : 0.3,
+                lineCount : new Cartesian2(8, 8),
+                lineThickness : new Cartesian2(2.0, 2.0)
+            });
+
+            return new Entity({
+                position : new Cartesian3(1234, 5678, 9101112),
+                ellipse : {
+                    semiMajorAxis : 2,
+                    semiMinorAxis : 1,
+                    height : 0,
+                    material: material
+                }
+            });
+        }
+
+        function renderScene() {
+            scene.initializeFrame();
+            var isUpdated = batch.update(time);
+            scene.render(time);
+            return isUpdated;
+        }
+
+        var entity1 = buildEntity();
+        var entity2 = buildEntity();
+
+        var updater1 = new EllipseGeometryUpdater(entity1, scene);
+        var updater2 = new EllipseGeometryUpdater(entity2, scene);
+
+        batch.add(time, updater1);
+        return pollToPromise(renderScene)
+        .then(function() {
+            expect(scene.primitives.length).toEqual(1);
+            var primitive = scene.primitives.get(0);
+            expect(primitive.show).toBeTruthy();
+        })
+        .then(function() {
+            batch.add(time, updater2);
+        })
+       .then(function() {
+            return pollToPromise(function() {
+                renderScene();
+                return scene.primitives.length === 2;
+            });
+        })
+        .then(function() {
+            var showCount = 0;
+            expect(scene.primitives.length).toEqual(2);
+            showCount += !!scene.primitives.get(0).show;
+            showCount += !!scene.primitives.get(1).show;
+            expect(showCount).toEqual(1);
+        })
+        .then(function() {
+            return pollToPromise(renderScene);
+        })
+        .then(function() {
+            expect(scene.primitives.length).toEqual(1);
+            var primitive = scene.primitives.get(0);
+            expect(primitive.show).toBeTruthy();
+
+            batch.removeAllPrimitives();
+        });
+    });
 });

Specs/DataSources/StaticGroundGeometryColorBatchSpec.js

@@ -169,4 +169,71 @@ defineSuite([
             batch.removeAllPrimitives();
         });
     });
+
+    it('shows only one primitive while rebuilding primitive', function() {
+        if (!GroundPrimitive.isSupported(scene)) {
+            return;
+        }
+
+        var batch = new StaticGroundGeometryColorBatch(scene.groundPrimitives, ClassificationType.BOTH);
+        function buildEntity() {
+            return new Entity({
+                position : new Cartesian3(1234, 5678, 9101112),
+                ellipse : {
+                    semiMajorAxis : 2,
+                    semiMinorAxis : 1,
+                    height : 0,
+                    outline : true,
+                    outlineColor : Color.RED.withAlpha(0.5)
+                }
+            });
+        }
+
+        function renderScene() {
+            scene.initializeFrame();
+            var isUpdated = batch.update(time);
+            scene.render(time);
+            return isUpdated;
+        }
+
+        var entity1 = buildEntity();
+        var entity2 = buildEntity();
+
+        var updater1 = new EllipseGeometryUpdater(entity1, scene);
+        var updater2 = new EllipseGeometryUpdater(entity2, scene);
+
+        batch.add(time, updater1);
+        return pollToPromise(renderScene)
+        .then(function() {
+            expect(scene.groundPrimitives.length).toEqual(1);
+            var primitive = scene.groundPrimitives.get(0);
+            expect(primitive.show).toBeTruthy();
+        })
+        .then(function() {
+            batch.add(time, updater2);
+        })
+       .then(function() {
+            return pollToPromise(function() {
+                renderScene();
+                return scene.groundPrimitives.length === 2;
+            });
+        })
+        .then(function() {
+            var showCount = 0;
+            expect(scene.groundPrimitives.length).toEqual(2);
+            showCount += !!scene.groundPrimitives.get(0).show;
+            showCount += !!scene.groundPrimitives.get(1).show;
+            expect(showCount).toEqual(1);
+        })
+        .then(function() {
+            return pollToPromise(renderScene);
+        })
+        .then(function() {
+            expect(scene.groundPrimitives.length).toEqual(1);
+            var primitive = scene.groundPrimitives.get(0);
+            expect(primitive.show).toBeTruthy();
+
+            batch.removeAllPrimitives();
+        });
+    });
 });

Specs/DataSources/StaticOutlineGeometryBatchSpec.js

@@ -184,4 +184,68 @@ defineSuite([
             batch.removeAllPrimitives();
         });
     });
+
+    it('shows only one primitive while rebuilding primitive', function() {
+        var batch = new StaticOutlineGeometryBatch(scene.primitives, scene, false, ShadowMode.DISABLED);
+
+        function buildEntity() {
+            return new Entity({
+                position : new Cartesian3(1234, 5678, 9101112),
+                ellipse : {
+                    semiMajorAxis : 2,
+                    semiMinorAxis : 1,
+                    height : 0,
+                    outline : true,
+                    outlineColor : Color.RED.withAlpha(0.5)
+                }
+            });
+        }
+
+        function renderScene() {
+            scene.initializeFrame();
+            var isUpdated = batch.update(time);
+            scene.render(time);
+            return isUpdated;
+        }
+
+        var entity1 = buildEntity();
+        var entity2 = buildEntity();
+
+        var updater1 = new EllipseGeometryUpdater(entity1, scene);
+        var updater2 = new EllipseGeometryUpdater(entity2, scene);
+
+        batch.add(time, updater1);
+        return pollToPromise(renderScene)
+        .then(function() {
+            expect(scene.primitives.length).toEqual(1);
+            var primitive = scene.primitives.get(0);
+            expect(primitive.show).toBeTruthy();
+        })
+        .then(function() {
+            batch.add(time, updater2);
+        })
+       .then(function() {
+            return pollToPromise(function() {
+                renderScene();
+                return scene.primitives.length === 2;
+            });
+        })
+        .then(function() {
+            var showCount = 0;
+            expect(scene.primitives.length).toEqual(2);
+            showCount += !!scene.primitives.get(0).show;
+            showCount += !!scene.primitives.get(1).show;
+            expect(showCount).toEqual(1);
+        })
+        .then(function() {
+            return pollToPromise(renderScene);
+        })
+        .then(function() {
+            expect(scene.primitives.length).toEqual(1);
+            var primitive = scene.primitives.get(0);
+            expect(primitive.show).toBeTruthy();
+
+            batch.removeAllPrimitives();
+        });
+    });
 });