@cesium/engine 11.1.0 → 12.0.1

package/Source/Scene/Model/Model.js

@@ -18,6 +18,7 @@ import RuntimeError from "../../Core/RuntimeError.js";
 import Pass from "../../Renderer/Pass.js";
 import ClippingPlaneCollection from "../ClippingPlaneCollection.js";
 import ClippingPolygonCollection from "../ClippingPolygonCollection.js";
+import DynamicEnvironmentMapManager from "../DynamicEnvironmentMapManager.js";
 import ColorBlendMode from "../ColorBlendMode.js";
 import GltfLoader from "../GltfLoader.js";
 import HeightReference, {
@@ -155,6 +156,7 @@ import pickModel from "./pickModel.js";
  * @privateParam {ClippingPolygonCollection} [options.clippingPolygons] The {@link ClippingPolygonCollection} used to selectively disable rendering the model.
  * @privateParam {Cartesian3} [options.lightColor] The light color when shading the model. When <code>undefined</code> the scene's light color is used instead.
  * @privateParam {ImageBasedLighting} [options.imageBasedLighting] The properties for managing image-based lighting on this model.
+ * @privateParam {DynamicEnvironmentMapManager.ConstructorOptions} [options.environmentMapOptions] The properties for managing dynamic environment maps on this model. Affects lighting.
  * @privateParam {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.
  * @privateParam {Credit|string} [options.credit] A credit for the data source, which is displayed on the canvas.
  * @privateParam {boolean} [options.showCreditsOnScreen=false] Whether to display the credits of this model on screen.
@@ -400,6 +402,16 @@ function Model(options) {
     : new ImageBasedLighting();
   this._shouldDestroyImageBasedLighting = !defined(options.imageBasedLighting);
 
+  this._environmentMapManager = undefined;
+  const environmentMapManager = new DynamicEnvironmentMapManager(
+    options.environmentMapOptions,
+  );
+  DynamicEnvironmentMapManager.setOwner(
+    environmentMapManager,
+    this,
+    "_environmentMapManager",
+  );
+
   this._backFaceCulling = defaultValue(options.backFaceCulling, true);
   this._backFaceCullingDirty = false;
 
@@ -1386,7 +1398,7 @@ Object.defineProperties(Model.prototype, {
   },
 
   /**
-   * The light color when shading the model. When <code>undefined</code> the scene's light color is used instead.
+   * The directional light color when shading the model. When <code>undefined</code> the scene's light color is used instead.
    * <p>
    * Disabling additional light sources by setting
    * <code>model.imageBasedLighting.imageBasedLightingFactor = new Cartesian2(0.0, 0.0)</code>
@@ -1424,7 +1436,7 @@ Object.defineProperties(Model.prototype, {
     },
     set: function (value) {
       //>>includeStart('debug', pragmas.debug);
-      Check.typeOf.object("imageBasedLighting", this._imageBasedLighting);
+      Check.typeOf.object("imageBasedLighting", value);
       //>>includeEnd('debug');
 
       if (value !== this._imageBasedLighting) {
@@ -1441,6 +1453,38 @@ Object.defineProperties(Model.prototype, {
     },
   },
 
+  /**
+   * The properties for managing dynamic environment maps on this model. Affects lighting.
+   * @memberof Model.prototype
+   * @readonly
+   *
+   * @example
+   * // Change the ground color used for a model's environment map to a forest green
+   * const environmentMapManager = model.environmentMapManager;
+   * environmentMapManager.groundColor = Cesium.Color.fromCssColorString("#203b34");
+   *
+   * @type {DynamicEnvironmentMapManager}
+   */
+  environmentMapManager: {
+    get: function () {
+      return this._environmentMapManager;
+    },
+    set: function (value) {
+      //>>includeStart('debug', pragmas.debug);
+      Check.typeOf.object("environmentMapManager", value);
+      //>>includeEnd('debug');
+
+      if (value !== this.environmentMapManager) {
+        DynamicEnvironmentMapManager.setOwner(
+          value,
+          this,
+          "_environmentMapManager",
+        );
+        this.resetDrawCommands();
+      }
+    },
+  },
+
   /**
    * Whether to cull back-facing geometry. When true, back face culling is
    * determined by the material's doubleSided property; when false, back face
@@ -1858,6 +1902,9 @@ Model.prototype.update = function (frameState) {
   // A custom shader may have to load texture uniforms.
   updateCustomShader(this, frameState);
 
+  // Environment maps, specular maps, and spherical harmonics may need to be updated or regenerated
+  updateEnvironmentMap(this, frameState);
+
   // The image-based lighting may have to load texture uniforms
   // for specular maps.
   updateImageBasedLighting(this, frameState);
@@ -1982,6 +2029,23 @@ function updateCustomShader(model, frameState) {
   }
 }
 
+function updateEnvironmentMap(model, frameState) {
+  const environmentMapManager = model._environmentMapManager;
+  const picking = frameState.passes.pick || frameState.passes.pickVoxel;
+  if (model._ready && environmentMapManager.owner === model && !picking) {
+    environmentMapManager.position = model._boundingSphere.center;
+    environmentMapManager.shouldUpdate =
+      !defined(model._imageBasedLighting.sphericalHarmonicCoefficients) ||
+      !defined(model._imageBasedLighting.specularEnvironmentMaps);
+
+    environmentMapManager.update(frameState);
+
+    if (environmentMapManager.shouldRegenerateShaders) {
+      model.resetDrawCommands();
+    }
+  }
+}
+
 function updateImageBasedLighting(model, frameState) {
   model._imageBasedLighting.update(frameState);
   if (model._imageBasedLighting.shouldRegenerateShaders) {
@@ -2338,30 +2402,27 @@ function updateReferenceMatrices(model, frameState) {
   const referenceMatrix = defaultValue(model.referenceMatrix, modelMatrix);
   const context = frameState.context;
 
-  const ibl = model._imageBasedLighting;
-  if (ibl.useSphericalHarmonicCoefficients || ibl.useSpecularEnvironmentMaps) {
-    let iblReferenceFrameMatrix3 = scratchIBLReferenceFrameMatrix3;
-    let iblReferenceFrameMatrix4 = scratchIBLReferenceFrameMatrix4;
+  let iblReferenceFrameMatrix3 = scratchIBLReferenceFrameMatrix3;
+  let iblReferenceFrameMatrix4 = scratchIBLReferenceFrameMatrix4;
 
-    iblReferenceFrameMatrix4 = Matrix4.multiply(
-      context.uniformState.view3D,
-      referenceMatrix,
-      iblReferenceFrameMatrix4,
-    );
-    iblReferenceFrameMatrix3 = Matrix4.getRotation(
-      iblReferenceFrameMatrix4,
-      iblReferenceFrameMatrix3,
-    );
-    iblReferenceFrameMatrix3 = Matrix3.transpose(
-      iblReferenceFrameMatrix3,
-      iblReferenceFrameMatrix3,
-    );
-    model._iblReferenceFrameMatrix = Matrix3.multiply(
-      yUpToZUp,
-      iblReferenceFrameMatrix3,
-      model._iblReferenceFrameMatrix,
-    );
-  }
+  iblReferenceFrameMatrix4 = Matrix4.multiply(
+    context.uniformState.view3D,
+    referenceMatrix,
+    iblReferenceFrameMatrix4,
+  );
+  iblReferenceFrameMatrix3 = Matrix4.getRotation(
+    iblReferenceFrameMatrix4,
+    iblReferenceFrameMatrix3,
+  );
+  iblReferenceFrameMatrix3 = Matrix3.transpose(
+    iblReferenceFrameMatrix3,
+    iblReferenceFrameMatrix3,
+  );
+  model._iblReferenceFrameMatrix = Matrix3.multiply(
+    yUpToZUp,
+    iblReferenceFrameMatrix3,
+    model._iblReferenceFrameMatrix,
+  );
 
   if (model.isClippingEnabled()) {
     let clippingPlanesMatrix = scratchClippingPlanesMatrix;
@@ -2782,6 +2843,16 @@ Model.prototype.destroy = function () {
   }
   this._imageBasedLighting = undefined;
 
+  // Only destroy the environment map manager if this is the owner.
+  const environmentMapManager = this._environmentMapManager;
+  if (
+    !environmentMapManager.isDestroyed() &&
+    environmentMapManager.owner === this
+  ) {
+    environmentMapManager.destroy();
+  }
+  this._environmentMapManager = undefined;
+
   destroyObject(this);
 };
 
@@ -2860,6 +2931,7 @@ Model.prototype.destroyModelResources = function () {
  * @param {ClippingPolygonCollection} [options.clippingPolygons] The {@link ClippingPolygonCollection} 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 {DynamicEnvironmentMapManager.ConstructorOptions} [options.environmentMapOptions] The properties for managing dynamic environment maps 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.
@@ -2990,6 +3062,7 @@ Model.fromGltfAsync = async function (options) {
 
   const modelOptions = makeModelOptions(loader, type, options);
   modelOptions.resource = resource;
+  modelOptions.environmentMapOptions = options.environmentMapOptions;
 
   try {
     // This load the gltf JSON and ensures the gltf is valid

package/Source/Scene/Model/Model3DTileContent.js

@@ -263,6 +263,11 @@ Model3DTileContent.prototype.update = function (tileset, frameState) {
         : undefined;
   }
 
+  const tilesetEnvironmentMapManager = tileset.environmentMapManager;
+  if (model.environmentMapManager !== tilesetClippingPlanes) {
+    model._environmentMapManager = tilesetEnvironmentMapManager;
+  }
+
   // If the model references a different ClippingPlaneCollection from the tileset,
   // update the model to use the new ClippingPlaneCollection.
   if (

package/Source/Scene/Model/ModelSceneGraph.js

@@ -601,6 +601,7 @@ ModelSceneGraph.prototype.buildDrawCommands = function (frameState) {
  * this method again to ensure the correct sequence of pipeline stages are
  * used.
  *
+ * @param {FrameState} frameState
  * @private
  */
 ModelSceneGraph.prototype.configurePipeline = function (frameState) {

package/Source/Scene/ScreenSpaceCameraController.js

@@ -271,6 +271,16 @@ function ScreenSpaceCameraController(scene) {
    * @default true
    */
   this.enableCollisionDetection = true;
+  /**
+   * The angle, relative to the ellipsoid normal, restricting the maximum amount that the user can tilt the camera. If <code>undefined</code>, the angle of the camera tilt is unrestricted.
+   * @type {number|undefined}
+   * @default undefined
+   *
+   * @example
+   * // Prevent the camera from tilting below the ellipsoid surface
+   * viewer.scene.screenSpaceCameraController.maximumTiltAngle = Math.PI / 2.0;
+   */
+  this.maximumTiltAngle = undefined;
 
   this._scene = scene;
   this._globe = undefined;
@@ -2063,7 +2073,16 @@ function rotate3D(
   );
 
   const deltaPhi = rotateRate * phiWindowRatio * Math.PI * 2.0;
-  const deltaTheta = rotateRate * thetaWindowRatio * Math.PI;
+  let deltaTheta = rotateRate * thetaWindowRatio * Math.PI;
+
+  if (defined(constrainedAxis) && defined(controller.maximumTiltAngle)) {
+    const maximumTiltAngle = controller.maximumTiltAngle;
+    const dotProduct = Cartesian3.dot(camera.direction, constrainedAxis);
+    const tilt = Math.PI - Math.acos(dotProduct) + deltaTheta;
+    if (tilt > maximumTiltAngle) {
+      deltaTheta -= tilt - maximumTiltAngle;
+    }
+  }
 
   if (!rotateOnlyVertical) {
     camera.rotateRight(deltaPhi);

package/Source/Shaders/Builtin/Functions/computeAtmosphereColor.glsl

@@ -42,3 +42,47 @@ vec4 czm_computeAtmosphereColor(
 
     return vec4(color, opacity);
 }
+
+/**
+ * Compute the atmosphere color, applying Rayleigh and Mie scattering. This
+ * builtin uses automatic uniforms so the atmophere settings are synced with the
+ * state of the Scene, even in other contexts like Model.
+ *
+ * @name czm_computeAtmosphereColor
+ * @glslFunction
+ *
+ * @param {czm_ray} primaryRay Ray from the origin to sky fragment to in world coords (low precision)
+ * @param {vec3} lightDirection Light direction from the sun or other light source.
+ * @param {vec3} rayleighColor The Rayleigh scattering color computed by a scattering function
+ * @param {vec3} mieColor The Mie scattering color computed by a scattering function
+ * @param {float} opacity The opacity computed by a scattering function.
+ */
+vec4 czm_computeAtmosphereColor(
+    czm_ray primaryRay,
+    vec3 lightDirection,
+    vec3 rayleighColor,
+    vec3 mieColor,
+    float opacity
+) {
+    vec3 direction = normalize(primaryRay.direction);
+
+    float cosAngle = dot(direction, lightDirection);
+    float cosAngleSq = cosAngle * cosAngle;
+
+    float G = czm_atmosphereMieAnisotropy;
+    float GSq = G * G;
+
+    // The Rayleigh phase function.
+    float rayleighPhase = 3.0 / (50.2654824574) * (1.0 + cosAngleSq);
+    // The Mie phase function.
+    float miePhase = 3.0 / (25.1327412287) * ((1.0 - GSq) * (cosAngleSq + 1.0)) / (pow(1.0 + GSq - 2.0 * cosAngle * G, 1.5) * (2.0 + GSq));
+
+    // The final color is generated by combining the effects of the Rayleigh and Mie scattering.
+    vec3 rayleigh = rayleighPhase * rayleighColor;
+    vec3 mie = miePhase * mieColor;
+
+    vec3 color = (rayleigh + mie) * czm_atmosphereLightIntensity;
+
+    return vec4(color, opacity);
+}
+

package/Source/Shaders/Builtin/Functions/computeAtmosphereColor.js

@@ -43,4 +43,48 @@ vec4 czm_computeAtmosphereColor(\n\
 \n\
     return vec4(color, opacity);\n\
 }\n\
+\n\
+/**\n\
+ * Compute the atmosphere color, applying Rayleigh and Mie scattering. This\n\
+ * builtin uses automatic uniforms so the atmophere settings are synced with the\n\
+ * state of the Scene, even in other contexts like Model.\n\
+ *\n\
+ * @name czm_computeAtmosphereColor\n\
+ * @glslFunction\n\
+ *\n\
+ * @param {czm_ray} primaryRay Ray from the origin to sky fragment to in world coords (low precision)\n\
+ * @param {vec3} lightDirection Light direction from the sun or other light source.\n\
+ * @param {vec3} rayleighColor The Rayleigh scattering color computed by a scattering function\n\
+ * @param {vec3} mieColor The Mie scattering color computed by a scattering function\n\
+ * @param {float} opacity The opacity computed by a scattering function.\n\
+ */\n\
+vec4 czm_computeAtmosphereColor(\n\
+    czm_ray primaryRay,\n\
+    vec3 lightDirection,\n\
+    vec3 rayleighColor,\n\
+    vec3 mieColor,\n\
+    float opacity\n\
+) {\n\
+    vec3 direction = normalize(primaryRay.direction);\n\
+\n\
+    float cosAngle = dot(direction, lightDirection);\n\
+    float cosAngleSq = cosAngle * cosAngle;\n\
+\n\
+    float G = czm_atmosphereMieAnisotropy;\n\
+    float GSq = G * G;\n\
+\n\
+    // The Rayleigh phase function.\n\
+    float rayleighPhase = 3.0 / (50.2654824574) * (1.0 + cosAngleSq);\n\
+    // The Mie phase function.\n\
+    float miePhase = 3.0 / (25.1327412287) * ((1.0 - GSq) * (cosAngleSq + 1.0)) / (pow(1.0 + GSq - 2.0 * cosAngle * G, 1.5) * (2.0 + GSq));\n\
+\n\
+    // The final color is generated by combining the effects of the Rayleigh and Mie scattering.\n\
+    vec3 rayleigh = rayleighPhase * rayleighColor;\n\
+    vec3 mie = miePhase * mieColor;\n\
+\n\
+    vec3 color = (rayleigh + mie) * czm_atmosphereLightIntensity;\n\
+\n\
+    return vec4(color, opacity);\n\
+}\n\
+\n\
 ";

package/Source/Shaders/Builtin/Functions/computeScattering.glsl

@@ -40,7 +40,6 @@ void czm_computeScattering(
 
     // Return empty colors if no intersection with the atmosphere geometry.
     if (primaryRayAtmosphereIntersect == czm_emptyRaySegment) {
-        rayleighColor = vec3(1.0, 0.0, 1.0);
         return;
     }
 

package/Source/Shaders/Builtin/Functions/computeScattering.js

@@ -41,7 +41,6 @@ void czm_computeScattering(\n\
 \n\
     // Return empty colors if no intersection with the atmosphere geometry.\n\
     if (primaryRayAtmosphereIntersect == czm_emptyRaySegment) {\n\
-        rayleighColor = vec3(1.0, 0.0, 1.0);\n\
         return;\n\
     }\n\
 \n\

package/Source/Shaders/Builtin/Functions/sphericalHarmonics.glsl

@@ -29,7 +29,7 @@ vec3 czm_sphericalHarmonics(vec3 normal, vec3 coefficients[9])
     float y = normal.y;
     float z = normal.z;
 
-    return
+    vec3 L =
           L00
         + L1_1 * y
         + L10 * z
@@ -39,4 +39,6 @@ vec3 czm_sphericalHarmonics(vec3 normal, vec3 coefficients[9])
         + L20 * (3.0 * z * z - 1.0)
         + L21 * (z * x)
         + L22 * (x * x - y * y);
+        
+    return max(L, vec3(0.0));
 }

package/Source/Shaders/Builtin/Functions/sphericalHarmonics.js

@@ -30,7 +30,7 @@ vec3 czm_sphericalHarmonics(vec3 normal, vec3 coefficients[9])\n\
     float y = normal.y;\n\
     float z = normal.z;\n\
 \n\
-    return\n\
+    vec3 L =\n\
           L00\n\
         + L1_1 * y\n\
         + L10 * z\n\
@@ -40,5 +40,7 @@ vec3 czm_sphericalHarmonics(vec3 normal, vec3 coefficients[9])\n\
         + L20 * (3.0 * z * z - 1.0)\n\
         + L21 * (z * x)\n\
         + L22 * (x * x - y * y);\n\
+        \n\
+    return max(L, vec3(0.0));\n\
 }\n\
 ";

package/Source/Shaders/ComputeIrradianceFS.glsl

@@ -0,0 +1,103 @@
+uniform samplerCube u_radianceMap;
+
+in vec2 v_textureCoordinates;
+
+
+const float twoSqrtPi = 2.0 * sqrt(czm_pi);
+
+// Coutesy of https://www.ppsloan.org/publications/StupidSH36.pdf
+float computeShBasis(int index, vec3 s) {
+    if (index == 0) { // l = 0, m = 0
+        return 1.0 / twoSqrtPi;
+    }
+    
+    if (index == 1) { // l = 1, m = -1
+        return -sqrt(3.0) * s.y / twoSqrtPi;
+    }
+
+    if (index == 2) { // l = 1, m = 0
+        return sqrt(3.0) * s.z / twoSqrtPi;
+    }
+
+    if (index == 3) { // l = 1, m = 1
+        return -sqrt(3.0) * s.x / twoSqrtPi;
+    }
+
+    if (index == 4) { // l = 2, m = -2
+        return sqrt(15.0) * s.y * s.x / twoSqrtPi;
+    }
+
+    if (index == 5) { // l = 2, m = -1
+        return -sqrt(15.0) * s.y * s.z / twoSqrtPi;
+    }
+
+    if (index == 6) { // l = 2, m = 0
+        return sqrt(5.0) * (3.0 * s.z * s.z - 1.0) / 2.0 / twoSqrtPi;
+    }
+
+    if (index == 7) { // l = 2, m = 1
+        return -sqrt(15.0) * s.x * s.z / twoSqrtPi;
+    }
+
+    if (index == 8) { // l = 2, m = 2
+        return sqrt(15.0) * (s.x * s.x - s.y * s.y) / 2.0 / twoSqrtPi;
+    }
+
+    return 0.0;
+}
+
+float vdcRadicalInverse(int i)
+{
+    float r;
+    float base = 2.0;
+    float value = 0.0;
+    float invBase = 1.0 / base;
+    float invBi = invBase;
+    for (int x = 0; x < 100; x++)
+    {
+        if (i <= 0)
+        {
+            break;
+        }
+        r = mod(float(i), base);
+        value += r * invBi;
+        invBi *= invBase;
+        i = int(float(i) * invBase);
+    }
+    return value;
+}
+
+vec2 hammersley2D(int i, int N)
+{
+    return vec2(float(i) / float(N), vdcRadicalInverse(i));
+}
+
+// Sample count is relatively low for the sake of performance, but should still be enough to capture directionality needed for third-order harmonics
+const int samples = 256; 
+const float solidAngle = 1.0 / float(samples);
+
+void main() {
+    // Get the current coefficient based on the uv
+   vec2 uv = v_textureCoordinates.xy * 3.0;
+   int coefficientIndex = int(floor(uv.y) * 3.0 + floor(uv.x));
+
+    for (int i = 0; i < samples; ++i) {
+        vec2 xi = hammersley2D(i, samples);
+        float phi = czm_twoPi * xi.x;
+        float cosTheta = 1.0 - 2.0 * sqrt(1.0 - xi.y * xi.y);
+        float sinTheta = sqrt(1.0 - cosTheta * cosTheta);
+        vec3 direction = normalize(vec3(sinTheta * cos(phi), cosTheta, sinTheta * sin(phi)));
+
+        // Generate the spherical harmonics basis from the direction
+        float Ylm = computeShBasis(coefficientIndex, direction);
+
+        vec3 lookupDirection = -direction.xyz;
+        lookupDirection.z = -lookupDirection.z;
+
+        vec4 color = czm_textureCube(u_radianceMap, lookupDirection, 0.0);
+
+        // Use the relevant function for this coefficient
+        out_FragColor += Ylm * color * solidAngle * sinTheta;
+    }
+    
+}

package/Source/Shaders/ComputeIrradianceFS.js

@@ -0,0 +1,105 @@
+//This file is automatically rebuilt by the Cesium build process.
+export default "uniform samplerCube u_radianceMap;\n\
+\n\
+in vec2 v_textureCoordinates;\n\
+\n\
+\n\
+const float twoSqrtPi = 2.0 * sqrt(czm_pi);\n\
+\n\
+// Coutesy of https://www.ppsloan.org/publications/StupidSH36.pdf\n\
+float computeShBasis(int index, vec3 s) {\n\
+    if (index == 0) { // l = 0, m = 0\n\
+        return 1.0 / twoSqrtPi;\n\
+    }\n\
+    \n\
+    if (index == 1) { // l = 1, m = -1\n\
+        return -sqrt(3.0) * s.y / twoSqrtPi;\n\
+    }\n\
+\n\
+    if (index == 2) { // l = 1, m = 0\n\
+        return sqrt(3.0) * s.z / twoSqrtPi;\n\
+    }\n\
+\n\
+    if (index == 3) { // l = 1, m = 1\n\
+        return -sqrt(3.0) * s.x / twoSqrtPi;\n\
+    }\n\
+\n\
+    if (index == 4) { // l = 2, m = -2\n\
+        return sqrt(15.0) * s.y * s.x / twoSqrtPi;\n\
+    }\n\
+\n\
+    if (index == 5) { // l = 2, m = -1\n\
+        return -sqrt(15.0) * s.y * s.z / twoSqrtPi;\n\
+    }\n\
+\n\
+    if (index == 6) { // l = 2, m = 0\n\
+        return sqrt(5.0) * (3.0 * s.z * s.z - 1.0) / 2.0 / twoSqrtPi;\n\
+    }\n\
+\n\
+    if (index == 7) { // l = 2, m = 1\n\
+        return -sqrt(15.0) * s.x * s.z / twoSqrtPi;\n\
+    }\n\
+\n\
+    if (index == 8) { // l = 2, m = 2\n\
+        return sqrt(15.0) * (s.x * s.x - s.y * s.y) / 2.0 / twoSqrtPi;\n\
+    }\n\
+\n\
+    return 0.0;\n\
+}\n\
+\n\
+float vdcRadicalInverse(int i)\n\
+{\n\
+    float r;\n\
+    float base = 2.0;\n\
+    float value = 0.0;\n\
+    float invBase = 1.0 / base;\n\
+    float invBi = invBase;\n\
+    for (int x = 0; x < 100; x++)\n\
+    {\n\
+        if (i <= 0)\n\
+        {\n\
+            break;\n\
+        }\n\
+        r = mod(float(i), base);\n\
+        value += r * invBi;\n\
+        invBi *= invBase;\n\
+        i = int(float(i) * invBase);\n\
+    }\n\
+    return value;\n\
+}\n\
+\n\
+vec2 hammersley2D(int i, int N)\n\
+{\n\
+    return vec2(float(i) / float(N), vdcRadicalInverse(i));\n\
+}\n\
+\n\
+// Sample count is relatively low for the sake of performance, but should still be enough to capture directionality needed for third-order harmonics\n\
+const int samples = 256; \n\
+const float solidAngle = 1.0 / float(samples);\n\
+\n\
+void main() {\n\
+    // Get the current coefficient based on the uv\n\
+   vec2 uv = v_textureCoordinates.xy * 3.0;\n\
+   int coefficientIndex = int(floor(uv.y) * 3.0 + floor(uv.x));\n\
+\n\
+    for (int i = 0; i < samples; ++i) {\n\
+        vec2 xi = hammersley2D(i, samples);\n\
+        float phi = czm_twoPi * xi.x;\n\
+        float cosTheta = 1.0 - 2.0 * sqrt(1.0 - xi.y * xi.y);\n\
+        float sinTheta = sqrt(1.0 - cosTheta * cosTheta);\n\
+        vec3 direction = normalize(vec3(sinTheta * cos(phi), cosTheta, sinTheta * sin(phi)));\n\
+\n\
+        // Generate the spherical harmonics basis from the direction\n\
+        float Ylm = computeShBasis(coefficientIndex, direction);\n\
+\n\
+        vec3 lookupDirection = -direction.xyz;\n\
+        lookupDirection.z = -lookupDirection.z;\n\
+\n\
+        vec4 color = czm_textureCube(u_radianceMap, lookupDirection, 0.0);\n\
+\n\
+        // Use the relevant function for this coefficient\n\
+        out_FragColor += Ylm * color * solidAngle * sinTheta;\n\
+    }\n\
+    \n\
+}\n\
+";