@cesium/engine 2.2.0 → 2.3.0

package/Source/Scene/Model/Model.js

@@ -2509,19 +2509,19 @@ function addCreditsToCreditDisplay(model, frameState) {
   // Add all credits to the credit display.
   const credit = model._credit;
   if (defined(credit)) {
-    creditDisplay.addCredit(credit);
+    creditDisplay.addCreditToNextFrame(credit);
   }
 
   const resourceCredits = model._resourceCredits;
   const resourceCreditsLength = resourceCredits.length;
   for (let c = 0; c < resourceCreditsLength; c++) {
-    creditDisplay.addCredit(resourceCredits[c]);
+    creditDisplay.addCreditToNextFrame(resourceCredits[c]);
   }
 
   const gltfCredits = model._gltfCredits;
   const gltfCreditsLength = gltfCredits.length;
   for (let c = 0; c < gltfCreditsLength; c++) {
-    creditDisplay.addCredit(gltfCredits[c]);
+    creditDisplay.addCreditToNextFrame(gltfCredits[c]);
   }
 }
 
@@ -2841,26 +2841,26 @@ Model.fromGltf = function (options) {
  * <p>
  * The model can be a traditional glTF asset with a .gltf extension or a Binary glTF using the .glb extension.
  *
- * @param {Object} options Object with the following properties:
- * @param {String|Resource} options.url The url to the .gltf or .glb file.
- * @param {String|Resource} [options.basePath=''] The base path that paths in the glTF JSON are relative to.
- * @param {Boolean} [options.show=true] Whether or not to render the model.
+ * @param {object} options Object with the following properties:
+ * @param {string|Resource} options.url The url to the .gltf or .glb file.
+ * @param {string|Resource} [options.basePath=''] The base path that paths in the glTF JSON are relative to.
+ * @param {boolean} [options.show=true] Whether or not to render the model.
  * @param {Matrix4} [options.modelMatrix=Matrix4.IDENTITY] The 4x4 transformation matrix that transforms the model from model to world coordinates.
- * @param {Number} [options.scale=1.0] A uniform scale applied to this model.
- * @param {Number} [options.minimumPixelSize=0.0] The approximate minimum pixel size of the model regardless of zoom.
- * @param {Number} [options.maximumScale] The maximum scale size of a model. An upper limit for minimumPixelSize.
- * @param {Object} [options.id] A user-defined object to return when the model is picked with {@link Scene#pick}.
- * @param {Boolean} [options.allowPicking=true] When <code>true</code>, each primitive is pickable with {@link Scene#pick}.
- * @param {Boolean} [options.incrementallyLoadTextures=true] Determine if textures may continue to stream in after the model is loaded.
- * @param {Boolean} [options.asynchronous=true] Determines if model WebGL resource creation will be spread out over several frames or block until completion once all glTF files are loaded.
- * @param {Boolean} [options.clampAnimations=true] Determines if the model's animations should hold a pose over frames where no keyframes are specified.
+ * @param {number} [options.scale=1.0] A uniform scale applied to this model.
+ * @param {number} [options.minimumPixelSize=0.0] The approximate minimum pixel size of the model regardless of zoom.
+ * @param {number} [options.maximumScale] The maximum scale size of a model. An upper limit for minimumPixelSize.
+ * @param {object} [options.id] A user-defined object to return when the model is picked with {@link Scene#pick}.
+ * @param {boolean} [options.allowPicking=true] When <code>true</code>, each primitive is pickable with {@link Scene#pick}.
+ * @param {boolean} [options.incrementallyLoadTextures=true] Determine if textures may continue to stream in after the model is loaded.
+ * @param {boolean} [options.asynchronous=true] Determines if model WebGL resource creation will be spread out over several frames or block until completion once all glTF files are loaded.
+ * @param {boolean} [options.clampAnimations=true] Determines if the model's animations should hold a pose over frames where no keyframes are specified.
  * @param {ShadowMode} [options.shadows=ShadowMode.ENABLED] Determines whether the model casts or receives shadows from light sources.
- * @param {Boolean} [options.releaseGltfJson=false] When true, the glTF JSON is released once the glTF is loaded. This is is especially useful for cases like 3D Tiles, where each .gltf model is unique and caching the glTF JSON is not effective.
- * @param {Boolean} [options.debugShowBoundingVolume=false] For debugging only. Draws the bounding sphere for each draw command in the model.
- * @param {Boolean} [options.enableDebugWireframe=false] For debugging only. This must be set to true for debugWireframe to work in WebGL1. This cannot be set after the model has loaded.
- * @param {Boolean} [options.debugWireframe=false] For debugging only. Draws the model in wireframe. Will only work for WebGL1 if enableDebugWireframe is set to true.
- * @param {Boolean} [options.cull=true]  Whether or not to cull the model using frustum/horizon culling. If the model is part of a 3D Tiles tileset, this property will always be false, since the 3D Tiles culling system is used.
- * @param {Boolean} [options.opaquePass=Pass.OPAQUE] The pass to use in the {@link DrawCommand} for the opaque portions of the model.
+ * @param {boolean} [options.releaseGltfJson=false] When true, the glTF JSON is released once the glTF is loaded. This is is especially useful for cases like 3D Tiles, where each .gltf model is unique and caching the glTF JSON is not effective.
+ * @param {boolean} [options.debugShowBoundingVolume=false] For debugging only. Draws the bounding sphere for each draw command in the model.
+ * @param {boolean} [options.enableDebugWireframe=false] For debugging only. This must be set to true for debugWireframe to work in WebGL1. This cannot be set after the model has loaded.
+ * @param {boolean} [options.debugWireframe=false] For debugging only. Draws the model in wireframe. Will only work for WebGL1 if enableDebugWireframe is set to true.
+ * @param {boolean} [options.cull=true]  Whether or not to cull the model using frustum/horizon culling. If the model is part of a 3D Tiles tileset, this property will always be false, since the 3D Tiles culling system is used.
+ * @param {boolean} [options.opaquePass=Pass.OPAQUE] The pass to use in the {@link DrawCommand} for the opaque portions of the model.
  * @param {Axis} [options.upAxis=Axis.Y] The up-axis of the glTF model.
  * @param {Axis} [options.forwardAxis=Axis.Z] The forward-axis of the glTF model.
  * @param {CustomShader} [options.customShader] A custom shader. This will add user-defined GLSL code to the vertex and fragment shaders. Using custom shaders with a {@link Cesium3DTileStyle} may lead to undefined behavior.
@@ -2870,28 +2870,31 @@ Model.fromGltf = function (options) {
  * @param {DistanceDisplayCondition} [options.distanceDisplayCondition] The condition specifying at what distance from the camera that this model will be displayed.
  * @param {Color} [options.color] A color that blends with the model's rendered color.
  * @param {ColorBlendMode} [options.colorBlendMode=ColorBlendMode.HIGHLIGHT] Defines how the color blends with the model.
- * @param {Number} [options.colorBlendAmount=0.5] Value used to determine the color strength when the <code>colorBlendMode</code> is <code>MIX</code>. A value of 0.0 results in the model's rendered color while a value of 1.0 results in a solid color, with any value in-between resulting in a mix of the two.
+ * @param {number} [options.colorBlendAmount=0.5] Value used to determine the color strength when the <code>colorBlendMode</code> is <code>MIX</code>. A value of 0.0 results in the model's rendered color while a value of 1.0 results in a solid color, with any value in-between resulting in a mix of the two.
  * @param {Color} [options.silhouetteColor=Color.RED] The silhouette color. If more than 256 models have silhouettes enabled, there is a small chance that overlapping models will have minor artifacts.
- * @param {Number} [options.silhouetteSize=0.0] The size of the silhouette in pixels.
- * @param {Boolean} [options.enableShowOutline=true] Whether to enable outlines for models using the {@link https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Vendor/CESIUM_primitive_outline|CESIUM_primitive_outline} extension. This can be set false to avoid post-processing geometry at load time. When false, the showOutlines and outlineColor options are ignored.
- * @param {Boolean} [options.showOutline=true] Whether to display the outline for models using the {@link https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Vendor/CESIUM_primitive_outline|CESIUM_primitive_outline} extension. When true, outlines are displayed. When false, outlines are not displayed.
+ * @param {number} [options.silhouetteSize=0.0] The size of the silhouette in pixels.
+ * @param {boolean} [options.enableShowOutline=true] Whether to enable outlines for models using the {@link https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Vendor/CESIUM_primitive_outline|CESIUM_primitive_outline} extension. This can be set false to avoid post-processing geometry at load time. When false, the showOutlines and outlineColor options are ignored.
+ * @param {boolean} [options.showOutline=true] Whether to display the outline for models using the {@link https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Vendor/CESIUM_primitive_outline|CESIUM_primitive_outline} extension. When true, outlines are displayed. When false, outlines are not displayed.
  * @param {Color} [options.outlineColor=Color.BLACK] The color to use when rendering outlines.
  * @param {ClippingPlaneCollection} [options.clippingPlanes] The {@link ClippingPlaneCollection} used to selectively disable rendering the model.
  * @param {Cartesian3} [options.lightColor] The light color when shading the model. When <code>undefined</code> the scene's light color is used instead.
  * @param {ImageBasedLighting} [options.imageBasedLighting] The properties for managing image-based lighting on this model.
- * @param {Boolean} [options.backFaceCulling=true] Whether to cull back-facing geometry. When true, back face culling is determined by the material's doubleSided property; when false, back face culling is disabled. Back faces are not culled if the model's color is translucent.
- * @param {Credit|String} [options.credit] A credit for the data source, which is displayed on the canvas.
- * @param {Boolean} [options.showCreditsOnScreen=false] Whether to display the credits of this model on screen.
+ * @param {boolean} [options.backFaceCulling=true] Whether to cull back-facing geometry. When true, back face culling is determined by the material's doubleSided property; when false, back face culling is disabled. Back faces are not culled if the model's color is translucent.
+ * @param {Credit|string} [options.credit] A credit for the data source, which is displayed on the canvas.
+ * @param {boolean} [options.showCreditsOnScreen=false] Whether to display the credits of this model on screen.
  * @param {SplitDirection} [options.splitDirection=SplitDirection.NONE] The {@link SplitDirection} split to apply to this model.
- * @param {Boolean} [options.projectTo2D=false] Whether to accurately project the model's positions in 2D. If this is true, the model will be projected accurately to 2D, but it will use more memory to do so. If this is false, the model will use less memory and will still render in 2D / CV mode, but its positions may be inaccurate. This disables minimumPixelSize and prevents future modification to the model matrix. This also cannot be set after the model has loaded.
- * @param {String|Number} [options.featureIdLabel="featureId_0"] Label of the feature ID set to use for picking and styling. For EXT_mesh_features, this is the feature ID's label property, or "featureId_N" (where N is the index in the featureIds array) when not specified. EXT_feature_metadata did not have a label field, so such feature ID sets are always labeled "featureId_N" where N is the index in the list of all feature Ids, where feature ID attributes are listed before feature ID textures. If featureIdLabel is an integer N, it is converted to the string "featureId_N" automatically. If both per-primitive and per-instance feature IDs are present, the instance feature IDs take priority.
- * @param {String|Number} [options.instanceFeatureIdLabel="instanceFeatureId_0"] Label of the instance feature ID set used for picking and styling. If instanceFeatureIdLabel is set to an integer N, it is converted to the string "instanceFeatureId_N" automatically. If both per-primitive and per-instance feature IDs are present, the instance feature IDs take priority.
- * @param {Object} [options.pointCloudShading] Options for constructing a {@link PointCloudShading} object to control point attenuation and lighting.
+ * @param {boolean} [options.projectTo2D=false] Whether to accurately project the model's positions in 2D. If this is true, the model will be projected accurately to 2D, but it will use more memory to do so. If this is false, the model will use less memory and will still render in 2D / CV mode, but its positions may be inaccurate. This disables minimumPixelSize and prevents future modification to the model matrix. This also cannot be set after the model has loaded.
+ * @param {string|number} [options.featureIdLabel="featureId_0"] Label of the feature ID set to use for picking and styling. For EXT_mesh_features, this is the feature ID's label property, or "featureId_N" (where N is the index in the featureIds array) when not specified. EXT_feature_metadata did not have a label field, so such feature ID sets are always labeled "featureId_N" where N is the index in the list of all feature Ids, where feature ID attributes are listed before feature ID textures. If featureIdLabel is an integer N, it is converted to the string "featureId_N" automatically. If both per-primitive and per-instance feature IDs are present, the instance feature IDs take priority.
+ * @param {string|number} [options.instanceFeatureIdLabel="instanceFeatureId_0"] Label of the instance feature ID set used for picking and styling. If instanceFeatureIdLabel is set to an integer N, it is converted to the string "instanceFeatureId_N" automatically. If both per-primitive and per-instance feature IDs are present, the instance feature IDs take priority.
+ * @param {object} [options.pointCloudShading] Options for constructing a {@link PointCloudShading} object to control point attenuation and lighting.
  * @param {ClassificationType} [options.classificationType] Determines whether terrain, 3D Tiles or both will be classified by this model. This cannot be set after the model has loaded.
+ * @param {Model.GltfCallback} [options.gltfCallback] A function that is called with the loaded gltf object once loaded.
  *
  * @returns {Promise<Model>} A promise that resolves to the created model when it is ready to render.
  *
  * @exception {RuntimeError} The model failed to load.
+ * @exception {RuntimeError} Unsupported glTF version.
+ * @exception {RuntimeError} Unsupported glTF Extension
  *
  * @example
  * // Load a model and add it to the scene
@@ -2931,6 +2934,28 @@ Model.fromGltf = function (options) {
  * } catch (error) {
  *  console.log(`Failed to load model. ${error}`);
  * }
+ *
+ * @example
+ * // Load a model and play the last animation at half speed
+ * let animations;
+ * try {
+ *  const model = await Cesium.Model.fromGltfAsync({
+ *    url: "../../SampleData/models/CesiumMan/Cesium_Man.glb",
+ *    gltfCallback: gltf => {
+ *      animations = gltf.animations
+ *    }
+ *  });
+ *  viewer.scene.primitives.add(model);
+ *  model.readyEvent.addEventListener(() => {
+ *    model.activeAnimations.add({
+ *      index: animations.length - 1,
+ *      loop: Cesium.ModelAnimationLoop.REPEAT,
+ *      multiplier: 0.5,
+ *    });
+ *  });
+ * } catch (error) {
+ *  console.log(`Failed to load model. ${error}`);
+ * }
  */
 Model.fromGltfAsync = async function (options) {
   options = defaultValue(options, defaultValue.EMPTY_OBJECT);
@@ -2988,22 +3013,31 @@ Model.fromGltfAsync = async function (options) {
     // Further resource loading is handled synchronously in loader.process(), and requires
     // hooking into model's update() as the frameState is needed
     await loader.load();
-
-    const model = new Model(modelOptions);
-
-    const resourceCredits = model._resource.credits;
-    if (defined(resourceCredits)) {
-      const length = resourceCredits.length;
-      for (let i = 0; i < length; i++) {
-        model._resourceCredits.push(resourceCredits[i]);
-      }
-    }
-
-    return model;
   } catch (error) {
     loader.destroy();
     throw ModelUtility.getError("model", resource, error);
   }
+
+  const gltfCallback = options.gltfCallback;
+  if (defined(gltfCallback)) {
+    //>>includeStart('debug', pragmas.debug);
+    Check.typeOf.func("options.gltfCallback", gltfCallback);
+    //>>includeEnd('debug');
+
+    gltfCallback(loader.gltfJson);
+  }
+
+  const model = new Model(modelOptions);
+
+  const resourceCredits = model._resource.credits;
+  if (defined(resourceCredits)) {
+    const length = resourceCredits.length;
+    for (let i = 0; i < length; i++) {
+      model._resourceCredits.push(resourceCredits[i]);
+    }
+  }
+
+  return model;
 };
 
 /*
@@ -3214,4 +3248,11 @@ function makeModelOptions(loader, modelType, options) {
   };
 }
 
+/**
+ * Interface for the function that is called with the loaded gltf object once loaded.
+ * @callback Model.GltfCallback
+ *
+ * @param {object} gltf The gltf object
+ */
+
 export default Model;

package/Source/Scene/Model/UniformType.js

@@ -104,7 +104,7 @@ const UniformType = {
    * @type {string}
    * @constant
    */
-  MAT3: "mat2",
+  MAT3: "mat3",
   /**
    * A 3x3 matrix of floating point values.
    *

package/Source/Scene/Picking.js

@@ -92,8 +92,9 @@ function getPickOrthographicCullingVolume(
 ) {
   const camera = scene.camera;
   let frustum = camera.frustum;
-  if (defined(frustum._offCenterFrustum)) {
-    frustum = frustum._offCenterFrustum;
+  const offCenterFrustum = frustum.offCenterFrustum;
+  if (defined(offCenterFrustum)) {
+    frustum = offCenterFrustum;
   }
 
   let x = (2.0 * (drawingBufferPosition.x - viewport.x)) / viewport.width - 1.0;

package/Source/Scene/QuadtreePrimitive.js

@@ -1275,8 +1275,9 @@ function screenSpaceError(primitive, frameState, tile) {
 function screenSpaceError2D(primitive, frameState, tile) {
   const camera = frameState.camera;
   let frustum = camera.frustum;
-  if (defined(frustum._offCenterFrustum)) {
-    frustum = frustum._offCenterFrustum;
+  const offCenterFrustum = frustum.offCenterFrustum;
+  if (defined(offCenterFrustum)) {
+    frustum = offCenterFrustum;
   }
 
   const context = frameState.context;

package/Source/Scene/SceneTransforms.js

@@ -432,8 +432,9 @@ SceneTransforms.drawingBufferToWgs84Coordinates = function (
   let worldCoords;
   let frustum = scene.camera.frustum;
   if (!defined(frustum.fovy)) {
-    if (defined(frustum._offCenterFrustum)) {
-      frustum = frustum._offCenterFrustum;
+    const offCenterFrustum = frustum.offCenterFrustum;
+    if (defined(offCenterFrustum)) {
+      frustum = offCenterFrustum;
     }
     worldCoords = scratchWorldCoords;
     worldCoords.x =

package/Source/Scene/ScreenSpaceCameraController.js

@@ -592,7 +592,7 @@ function handleZoom(
   if (camera.frustum instanceof OrthographicFrustum) {
     if (Math.abs(distance) > 0.0) {
       camera.zoomIn(distance);
-      camera._adjustOrthographicFrustum();
+      camera._adjustOrthographicFrustum(true);
     }
     return;
   }

package/Source/Scene/Vector3DTilePoints.js

@@ -394,11 +394,15 @@ Vector3DTilePoints.prototype.applyStyle = function (style, features) {
 
     if (defined(style.scaleByDistance)) {
       const scaleByDistanceCart4 = style.scaleByDistance.evaluate(feature);
-      scratchScaleByDistance.near = scaleByDistanceCart4.x;
-      scratchScaleByDistance.nearValue = scaleByDistanceCart4.y;
-      scratchScaleByDistance.far = scaleByDistanceCart4.z;
-      scratchScaleByDistance.farValue = scaleByDistanceCart4.w;
-      feature.scaleByDistance = scratchScaleByDistance;
+      if (defined(scaleByDistanceCart4)) {
+        scratchScaleByDistance.near = scaleByDistanceCart4.x;
+        scratchScaleByDistance.nearValue = scaleByDistanceCart4.y;
+        scratchScaleByDistance.far = scaleByDistanceCart4.z;
+        scratchScaleByDistance.farValue = scaleByDistanceCart4.w;
+        feature.scaleByDistance = scratchScaleByDistance;
+      } else {
+        feature.scaleByDistance = undefined;
+      }
     } else {
       feature.scaleByDistance = undefined;
     }
@@ -407,11 +411,15 @@ Vector3DTilePoints.prototype.applyStyle = function (style, features) {
       const translucencyByDistanceCart4 = style.translucencyByDistance.evaluate(
         feature
       );
-      scratchTranslucencyByDistance.near = translucencyByDistanceCart4.x;
-      scratchTranslucencyByDistance.nearValue = translucencyByDistanceCart4.y;
-      scratchTranslucencyByDistance.far = translucencyByDistanceCart4.z;
-      scratchTranslucencyByDistance.farValue = translucencyByDistanceCart4.w;
-      feature.translucencyByDistance = scratchTranslucencyByDistance;
+      if (defined(translucencyByDistanceCart4)) {
+        scratchTranslucencyByDistance.near = translucencyByDistanceCart4.x;
+        scratchTranslucencyByDistance.nearValue = translucencyByDistanceCart4.y;
+        scratchTranslucencyByDistance.far = translucencyByDistanceCart4.z;
+        scratchTranslucencyByDistance.farValue = translucencyByDistanceCart4.w;
+        feature.translucencyByDistance = scratchTranslucencyByDistance;
+      } else {
+        feature.translucencyByDistance = undefined;
+      }
     } else {
       feature.translucencyByDistance = undefined;
     }
@@ -420,9 +428,13 @@ Vector3DTilePoints.prototype.applyStyle = function (style, features) {
       const distanceDisplayConditionCart2 = style.distanceDisplayCondition.evaluate(
         feature
       );
-      scratchDistanceDisplayCondition.near = distanceDisplayConditionCart2.x;
-      scratchDistanceDisplayCondition.far = distanceDisplayConditionCart2.y;
-      feature.distanceDisplayCondition = scratchDistanceDisplayCondition;
+      if (defined(distanceDisplayConditionCart2)) {
+        scratchDistanceDisplayCondition.near = distanceDisplayConditionCart2.x;
+        scratchDistanceDisplayCondition.far = distanceDisplayConditionCart2.y;
+        feature.distanceDisplayCondition = scratchDistanceDisplayCondition;
+      } else {
+        feature.distanceDisplayCondition = undefined;
+      }
     } else {
       feature.distanceDisplayCondition = undefined;
     }

package/Source/Shaders/AtmosphereCommon.glsl

@@ -8,8 +8,16 @@ uniform vec3 u_atmosphereRayleighCoefficient;
 uniform vec3 u_atmosphereMieCoefficient;
 
 const float ATMOSPHERE_THICKNESS = 111e3; // The thickness of the atmosphere in meters.
-const int PRIMARY_STEPS = 16; // Number of times the ray from the camera to the world position (primary ray) is sampled.
-const int LIGHT_STEPS = 4; // Number of times the light is sampled from the light source's intersection with the atmosphere to a sample position on the primary ray.
+const int PRIMARY_STEPS_MAX = 16; // Maximum number of times the ray from the camera to the world position (primary ray) is sampled.
+const int LIGHT_STEPS_MAX = 4; // Maximum number of times the light is sampled from the light source's intersection with the atmosphere to a sample position on the primary ray.
+
+/**
+ * Rational approximation to tanh(x)
+*/
+float approximateTanh(float x) {
+    float x2 = x * x;
+    return max(-1.0, min(+1.0, x * (27.0 + x2) / (27.0 + 9.0 * x2)));
+}
 
 /**
  * This function computes the colors contributed by Rayliegh and Mie scattering on a given ray, as well as
@@ -50,14 +58,36 @@ void computeScattering(
         return;
     }
 
+    // To deal with smaller values of PRIMARY_STEPS (e.g. 4)
+    // we implement a split strategy: sky or horizon.
+    // For performance reasons, instead of a if/else branch
+    // a soft choice is implemented through a weight 0.0 <= w_stop_gt_lprl <= 1.0
+    float x = 1e-7 * primaryRayAtmosphereIntersect.stop / length(primaryRayLength);
+    // Value close to 0.0: close to the horizon
+    // Value close to 1.0: above in the sky
+    float w_stop_gt_lprl = 0.5 * (1.0 + approximateTanh(x));
+    
     // The ray should start from the first intersection with the outer atmopshere, or from the camera position, if it is inside the atmosphere.
+    float start_0 = primaryRayAtmosphereIntersect.start;
     primaryRayAtmosphereIntersect.start = max(primaryRayAtmosphereIntersect.start, 0.0);
     // The ray should end at the exit from the atmosphere or at the distance to the vertex, whichever is smaller.
     primaryRayAtmosphereIntersect.stop = min(primaryRayAtmosphereIntersect.stop, length(primaryRayLength));
 
+    // For the number of ray steps, distinguish inside or outside atmosphere (outer space)
+    // (1) from outer space we have to use more ray steps to get a realistic rendering
+    // (2) within atmosphere we need fewer steps for faster rendering
+    float x_o_a = start_0 - ATMOSPHERE_THICKNESS; // ATMOSPHERE_THICKNESS used as an ad-hoc constant, no precise meaning here, only the order of magnitude matters
+    float w_inside_atmosphere = 1.0 - 0.5 * (1.0 + approximateTanh(x_o_a));
+    int PRIMARY_STEPS = PRIMARY_STEPS_MAX - int(w_inside_atmosphere * 12.0); // Number of times the ray from the camera to the world position (primary ray) is sampled.
+    int LIGHT_STEPS = LIGHT_STEPS_MAX - int(w_inside_atmosphere * 2.0); // Number of times the light is sampled from the light source's intersection with the atmosphere to a sample position on the primary ray.
+
     // Setup for sampling positions along the ray - starting from the intersection with the outer ring of the atmosphere.
-    float rayStepLength = (primaryRayAtmosphereIntersect.stop - primaryRayAtmosphereIntersect.start) / float(PRIMARY_STEPS);
     float rayPositionLength = primaryRayAtmosphereIntersect.start;
+    // (1) Outside the atmosphere: constant rayStepLength
+    // (2) Inside atmosphere: variable rayStepLength to compensate the rough rendering of the smaller number of ray steps
+    float totalRayLength = primaryRayAtmosphereIntersect.stop - rayPositionLength;
+    float rayStepLengthIncrease = w_inside_atmosphere * ((1.0 - w_stop_gt_lprl) * totalRayLength / (float(PRIMARY_STEPS * (PRIMARY_STEPS + 1)) / 2.0));
+    float rayStepLength = max(1.0 - w_inside_atmosphere, w_stop_gt_lprl) * totalRayLength / max(7.0 * w_inside_atmosphere, float(PRIMARY_STEPS));
 
     vec3 rayleighAccumulation = vec3(0.0);
     vec3 mieAccumulation = vec3(0.0);
@@ -65,10 +95,17 @@ void computeScattering(
     vec2 heightScale = vec2(u_atmosphereRayleighScaleHeight, u_atmosphereMieScaleHeight);
 
     // Sample positions on the primary ray.
-    for (int i = 0; i < PRIMARY_STEPS; i++) {
+    for (int i = 0; i < PRIMARY_STEPS_MAX; ++i) {
+
+        // The loop should be: for (int i = 0; i < PRIMARY_STEPS; ++i) {...} but WebGL1 cannot
+        // loop with non-constant condition, so it has to break early instead
+        if (i >= PRIMARY_STEPS) {
+            break;
+        }
+
         // Calculate sample position along viewpoint ray.
         vec3 samplePosition = primaryRay.origin + primaryRay.direction * (rayPositionLength + rayStepLength);
-        
+
         // Calculate height of sample position above ellipsoid.
         float sampleHeight = length(samplePosition) - atmosphereInnerRadius;
 
@@ -79,14 +116,20 @@ void computeScattering(
         // Generate ray from the sample position segment to the light source, up to the outer ring of the atmosphere.
         czm_ray lightRay = czm_ray(samplePosition, lightDirection);
         czm_raySegment lightRayAtmosphereIntersect = czm_raySphereIntersectionInterval(lightRay, origin, atmosphereOuterRadius);
-        
+
         float lightStepLength = lightRayAtmosphereIntersect.stop / float(LIGHT_STEPS);
         float lightPositionLength = 0.0;
 
         vec2 lightOpticalDepth = vec2(0.0);
 
         // Sample positions along the light ray, to accumulate incidence of light on the latest sample segment.
-        for (int j = 0; j < LIGHT_STEPS; j++) {
+        for (int j = 0; j < LIGHT_STEPS_MAX; ++j) {
+
+            // The loop should be: for (int j = 0; i < LIGHT_STEPS; ++j) {...} but WebGL1 cannot
+            // loop with non-constant condition, so it has to break early instead
+            if (j >= LIGHT_STEPS) {
+                break;
+            }
 
             // Calculate sample position along light ray.
             vec3 lightPosition = samplePosition + lightDirection * (lightPositionLength + lightStepLength * 0.5);
@@ -109,7 +152,7 @@ void computeScattering(
         mieAccumulation += sampleDensity.y * attenuation;
 
         // Increment distance on primary ray.
-        rayPositionLength += rayStepLength;
+        rayPositionLength += (rayStepLength += rayStepLengthIncrease);
     }
 
     // Compute the scattering amount.

package/Source/Shaders/AtmosphereCommon.js

@@ -9,8 +9,16 @@ uniform vec3 u_atmosphereRayleighCoefficient;\n\
 uniform vec3 u_atmosphereMieCoefficient;\n\
 \n\
 const float ATMOSPHERE_THICKNESS = 111e3; // The thickness of the atmosphere in meters.\n\
-const int PRIMARY_STEPS = 16; // Number of times the ray from the camera to the world position (primary ray) is sampled.\n\
-const int LIGHT_STEPS = 4; // Number of times the light is sampled from the light source's intersection with the atmosphere to a sample position on the primary ray.\n\
+const int PRIMARY_STEPS_MAX = 16; // Maximum number of times the ray from the camera to the world position (primary ray) is sampled.\n\
+const int LIGHT_STEPS_MAX = 4; // Maximum number of times the light is sampled from the light source's intersection with the atmosphere to a sample position on the primary ray.\n\
+\n\
+/**\n\
+ * Rational approximation to tanh(x)\n\
+*/\n\
+float approximateTanh(float x) {\n\
+    float x2 = x * x;\n\
+    return max(-1.0, min(+1.0, x * (27.0 + x2) / (27.0 + 9.0 * x2)));\n\
+}\n\
 \n\
 /**\n\
  * This function computes the colors contributed by Rayliegh and Mie scattering on a given ray, as well as\n\
@@ -51,14 +59,36 @@ void computeScattering(\n\
         return;\n\
     }\n\
 \n\
+    // To deal with smaller values of PRIMARY_STEPS (e.g. 4)\n\
+    // we implement a split strategy: sky or horizon.\n\
+    // For performance reasons, instead of a if/else branch\n\
+    // a soft choice is implemented through a weight 0.0 <= w_stop_gt_lprl <= 1.0\n\
+    float x = 1e-7 * primaryRayAtmosphereIntersect.stop / length(primaryRayLength);\n\
+    // Value close to 0.0: close to the horizon\n\
+    // Value close to 1.0: above in the sky\n\
+    float w_stop_gt_lprl = 0.5 * (1.0 + approximateTanh(x));\n\
+    \n\
     // The ray should start from the first intersection with the outer atmopshere, or from the camera position, if it is inside the atmosphere.\n\
+    float start_0 = primaryRayAtmosphereIntersect.start;\n\
     primaryRayAtmosphereIntersect.start = max(primaryRayAtmosphereIntersect.start, 0.0);\n\
     // The ray should end at the exit from the atmosphere or at the distance to the vertex, whichever is smaller.\n\
     primaryRayAtmosphereIntersect.stop = min(primaryRayAtmosphereIntersect.stop, length(primaryRayLength));\n\
+\n\
+    // For the number of ray steps, distinguish inside or outside atmosphere (outer space)\n\
+    // (1) from outer space we have to use more ray steps to get a realistic rendering\n\
+    // (2) within atmosphere we need fewer steps for faster rendering\n\
+    float x_o_a = start_0 - ATMOSPHERE_THICKNESS; // ATMOSPHERE_THICKNESS used as an ad-hoc constant, no precise meaning here, only the order of magnitude matters\n\
+    float w_inside_atmosphere = 1.0 - 0.5 * (1.0 + approximateTanh(x_o_a));\n\
+    int PRIMARY_STEPS = PRIMARY_STEPS_MAX - int(w_inside_atmosphere * 12.0); // Number of times the ray from the camera to the world position (primary ray) is sampled.\n\
+    int LIGHT_STEPS = LIGHT_STEPS_MAX - int(w_inside_atmosphere * 2.0); // Number of times the light is sampled from the light source's intersection with the atmosphere to a sample position on the primary ray.\n\
 \n\
     // Setup for sampling positions along the ray - starting from the intersection with the outer ring of the atmosphere.\n\
-    float rayStepLength = (primaryRayAtmosphereIntersect.stop - primaryRayAtmosphereIntersect.start) / float(PRIMARY_STEPS);\n\
     float rayPositionLength = primaryRayAtmosphereIntersect.start;\n\
+    // (1) Outside the atmosphere: constant rayStepLength\n\
+    // (2) Inside atmosphere: variable rayStepLength to compensate the rough rendering of the smaller number of ray steps\n\
+    float totalRayLength = primaryRayAtmosphereIntersect.stop - rayPositionLength;\n\
+    float rayStepLengthIncrease = w_inside_atmosphere * ((1.0 - w_stop_gt_lprl) * totalRayLength / (float(PRIMARY_STEPS * (PRIMARY_STEPS + 1)) / 2.0));\n\
+    float rayStepLength = max(1.0 - w_inside_atmosphere, w_stop_gt_lprl) * totalRayLength / max(7.0 * w_inside_atmosphere, float(PRIMARY_STEPS));\n\
 \n\
     vec3 rayleighAccumulation = vec3(0.0);\n\
     vec3 mieAccumulation = vec3(0.0);\n\
@@ -66,10 +96,17 @@ void computeScattering(\n\
     vec2 heightScale = vec2(u_atmosphereRayleighScaleHeight, u_atmosphereMieScaleHeight);\n\
 \n\
     // Sample positions on the primary ray.\n\
-    for (int i = 0; i < PRIMARY_STEPS; i++) {\n\
+    for (int i = 0; i < PRIMARY_STEPS_MAX; ++i) {\n\
+\n\
+        // The loop should be: for (int i = 0; i < PRIMARY_STEPS; ++i) {...} but WebGL1 cannot\n\
+        // loop with non-constant condition, so it has to break early instead\n\
+        if (i >= PRIMARY_STEPS) {\n\
+            break;\n\
+        }\n\
+\n\
         // Calculate sample position along viewpoint ray.\n\
         vec3 samplePosition = primaryRay.origin + primaryRay.direction * (rayPositionLength + rayStepLength);\n\
-        \n\
+\n\
         // Calculate height of sample position above ellipsoid.\n\
         float sampleHeight = length(samplePosition) - atmosphereInnerRadius;\n\
 \n\
@@ -80,14 +117,20 @@ void computeScattering(\n\
         // Generate ray from the sample position segment to the light source, up to the outer ring of the atmosphere.\n\
         czm_ray lightRay = czm_ray(samplePosition, lightDirection);\n\
         czm_raySegment lightRayAtmosphereIntersect = czm_raySphereIntersectionInterval(lightRay, origin, atmosphereOuterRadius);\n\
-        \n\
+\n\
         float lightStepLength = lightRayAtmosphereIntersect.stop / float(LIGHT_STEPS);\n\
         float lightPositionLength = 0.0;\n\
 \n\
         vec2 lightOpticalDepth = vec2(0.0);\n\
 \n\
         // Sample positions along the light ray, to accumulate incidence of light on the latest sample segment.\n\
-        for (int j = 0; j < LIGHT_STEPS; j++) {\n\
+        for (int j = 0; j < LIGHT_STEPS_MAX; ++j) {\n\
+\n\
+            // The loop should be: for (int j = 0; i < LIGHT_STEPS; ++j) {...} but WebGL1 cannot\n\
+            // loop with non-constant condition, so it has to break early instead\n\
+            if (j >= LIGHT_STEPS) {\n\
+                break;\n\
+            }\n\
 \n\
             // Calculate sample position along light ray.\n\
             vec3 lightPosition = samplePosition + lightDirection * (lightPositionLength + lightStepLength * 0.5);\n\
@@ -110,7 +153,7 @@ void computeScattering(\n\
         mieAccumulation += sampleDensity.y * attenuation;\n\
 \n\
         // Increment distance on primary ray.\n\
-        rayPositionLength += rayStepLength;\n\
+        rayPositionLength += (rayStepLength += rayStepLengthIncrease);\n\
     }\n\
 \n\
     // Compute the scattering amount.\n\

package/Source/Shaders/PostProcessStages/AmbientOcclusionGenerate.glsl

@@ -58,7 +58,7 @@ void main(void)
     float gapAngle = 90.0 * czm_radiansPerDegree;
 
     // RandomNoise
-    float randomVal = texture(randomTexture, v_textureCoordinates).x;
+    float randomVal = texture(randomTexture, v_textureCoordinates / pixelSize / 255.0).x;
 
     //Loop for each direction
     for (int i = 0; i < 4; i++)

package/Source/Shaders/PostProcessStages/AmbientOcclusionGenerate.js

@@ -59,7 +59,7 @@ void main(void)\n\
     float gapAngle = 90.0 * czm_radiansPerDegree;\n\
 \n\
     // RandomNoise\n\
-    float randomVal = texture(randomTexture, v_textureCoordinates).x;\n\
+    float randomVal = texture(randomTexture, v_textureCoordinates / pixelSize / 255.0).x;\n\
 \n\
     //Loop for each direction\n\
     for (int i = 0; i < 4; i++)\n\

package/Source/Shaders/PostProcessStages/AmbientOcclusionModulate.glsl

@@ -5,7 +5,7 @@ in vec2 v_textureCoordinates;
 
 void main(void)
 {
-    vec3 color = texture(colorTexture, v_textureCoordinates).rgb;
-    vec3 ao = texture(ambientOcclusionTexture, v_textureCoordinates).rgb;
-    out_FragColor.rgb = ambientOcclusionOnly ? ao : ao * color;
+    vec4 color = texture(colorTexture, v_textureCoordinates);
+    vec4 ao = texture(ambientOcclusionTexture, v_textureCoordinates);
+    out_FragColor = ambientOcclusionOnly ? ao : ao * color;
 }

package/Source/Shaders/PostProcessStages/AmbientOcclusionModulate.js

@@ -6,8 +6,8 @@ in vec2 v_textureCoordinates;\n\
 \n\
 void main(void)\n\
 {\n\
-    vec3 color = texture(colorTexture, v_textureCoordinates).rgb;\n\
-    vec3 ao = texture(ambientOcclusionTexture, v_textureCoordinates).rgb;\n\
-    out_FragColor.rgb = ambientOcclusionOnly ? ao : ao * color;\n\
+    vec4 color = texture(colorTexture, v_textureCoordinates);\n\
+    vec4 ao = texture(ambientOcclusionTexture, v_textureCoordinates);\n\
+    out_FragColor = ambientOcclusionOnly ? ao : ao * color;\n\
 }\n\
 ";

package/Source/Widget/CesiumWidget.js

@@ -520,6 +520,18 @@ Object.defineProperties(CesiumWidget.prototype, {
     },
   },
 
+  /**
+   * Manages the list of credits to display on screen and in the lightbox.
+   * @memberof CesiumWidget.prototype
+   *
+   * @type {CreditDisplay}
+   */
+  creditDisplay: {
+    get: function () {
+      return this._scene.frameState.creditDisplay;
+    },
+  },
+
   /**
    * Gets the camera.
    * @memberof CesiumWidget.prototype