@cesium/engine 10.1.0 → 11.0.0

package/Source/Renderer/UniformState.js

@@ -157,7 +157,6 @@ function UniformState() {
 
   this._sphericalHarmonicCoefficients = undefined;
   this._specularEnvironmentMaps = undefined;
-  this._specularEnvironmentMapsDimensions = new Cartesian2();
   this._specularEnvironmentMapsMaximumLOD = undefined;
 
   this._fogDensity = undefined;
@@ -1084,7 +1083,7 @@ Object.defineProperties(UniformState.prototype, {
   },
 
   /**
-   * The specular environment map atlas of the scene.
+   * The specular environment cube map of the scene.
    * @memberof UniformState.prototype
    * @type {Texture}
    */
@@ -1095,18 +1094,7 @@ Object.defineProperties(UniformState.prototype, {
   },
 
   /**
-   * The dimensions of the specular environment map atlas of the scene.
-   * @memberof UniformState.prototype
-   * @type {Cartesian2}
-   */
-  specularEnvironmentMapsDimensions: {
-    get: function () {
-      return this._specularEnvironmentMapsDimensions;
-    },
-  },
-
-  /**
-   * The maximum level-of-detail of the specular environment map atlas of the scene.
+   * The maximum level-of-detail of the specular environment cube map of the scene.
    * @memberof UniformState.prototype
    * @type {number}
    */
@@ -1491,7 +1479,7 @@ UniformState.prototype.update = function (frameState) {
   );
 
   // IE 11 doesn't optimize out uniforms that are #ifdef'd out. So undefined values for the spherical harmonic
-  // coefficients and specular environment map atlas dimensions cause a crash.
+  // coefficients cause a crash.
   this._sphericalHarmonicCoefficients = defaultValue(
     frameState.sphericalHarmonicCoefficients,
     EMPTY_ARRAY
@@ -1500,13 +1488,6 @@ UniformState.prototype.update = function (frameState) {
   this._specularEnvironmentMapsMaximumLOD =
     frameState.specularEnvironmentMapsMaximumLOD;
 
-  if (defined(this._specularEnvironmentMaps)) {
-    Cartesian2.clone(
-      this._specularEnvironmentMaps.dimensions,
-      this._specularEnvironmentMapsDimensions
-    );
-  }
-
   this._fogDensity = frameState.fog.density;
   this._fogMinimumBrightness = frameState.fog.minimumBrightness;
 

package/Source/Renderer/demodernizeShader.js

@@ -60,6 +60,8 @@ function demodernizeShader(input, isFragmentShader) {
       output = output.replaceAll(/gl_FragDepth/g, `gl_FragDepthEXT`);
     }
 
+    // Enable the EXT_shader_texture_lod extension
+    output = `#ifdef GL_EXT_shader_texture_lod\n#extension GL_EXT_shader_texture_lod : enable\n#endif\n${output}`;
     // Enable the OES_standard_derivatives extension
     output = `#ifdef GL_OES_standard_derivatives\n#extension GL_OES_standard_derivatives : enable\n#endif\n${output}`;
   } else {

package/Source/Renderer/loadCubeMap.js

@@ -41,17 +41,12 @@ import CubeMap from "./CubeMap.js";
 function loadCubeMap(context, urls, skipColorSpaceConversion) {
   //>>includeStart('debug', pragmas.debug);
   Check.defined("context", context);
+  Check.defined("urls", urls);
   if (
-    !defined(urls) ||
-    !defined(urls.positiveX) ||
-    !defined(urls.negativeX) ||
-    !defined(urls.positiveY) ||
-    !defined(urls.negativeY) ||
-    !defined(urls.positiveZ) ||
-    !defined(urls.negativeZ)
+    Object.values(CubeMap.FaceName).some((faceName) => !defined(urls[faceName]))
   ) {
     throw new DeveloperError(
-      "urls is required and must have positiveX, negativeX, positiveY, negativeY, positiveZ, and negativeZ properties."
+      "urls must have positiveX, negativeX, positiveY, negativeY, positiveZ, and negativeZ properties."
     );
   }
   //>>includeEnd('debug');

package/Source/Scene/ArcGisMapService.js

@@ -4,7 +4,7 @@ import Resource from "../Core/Resource.js";
 
 let defaultTokenCredit;
 const defaultAccessToken =
-  "AAPTxy8BH1VEsoebNVZXo8HurEOF051kAEKlhkOhBEc9BmTRbx8gaNqtBYKRq3vEnwSKnwUE1aRn2Siyo0gHWzzPwpJd-ZUeTyDgQZPqW8C6pXNLOE3bRO6-Jz3NFmp-qNquqGBQTATcCHbNsL-h9CPyMMPGsTcUvzPlIInazMfkWJNbFmqJeSzPj_1DHshXa0XCfkQn5mVxlF2dFt10Mq2bGo0HkpdpXwNQdoGwdphsLoU.AT1_CpQKgEim";
+  "AAPTxy8BH1VEsoebNVZXo8HurEOF051kAEKlhkOhBEc9BmSXu8_pRnGhnW6yZLct-ukUzbJaZRAVfnmUrxDcAu_FaFDIC3M57EwfRm_DuTw9D5oHdLBTYIMD3tpUeFsNDjHHqar5fb1FGIN9KIV1Gk64dNBmhHhuOHY8cq2IhI0XFLj2qnAlqtKnM-lLsO6JpHuHPVD799V1o9VFm9vMW6a66vEi8-e--2QzKQecPYiaq98.AT1_p4pHwb3n";
 /**
  * Default options for accessing the ArcGIS image tile service.
  *

package/Source/Scene/CameraEventAggregator.js

@@ -9,7 +9,7 @@ import ScreenSpaceEventType from "../Core/ScreenSpaceEventType.js";
 import CameraEventType from "./CameraEventType.js";
 
 function getKey(type, modifier) {
-  let key = type;
+  let key = `${type}`;
   if (defined(modifier)) {
     key += `+${modifier}`;
   }
@@ -178,7 +178,6 @@ function listenMouseButtonDownUp(aggregator, modifier, type) {
   const isDown = aggregator._isDown;
   const eventStartPosition = aggregator._eventStartPosition;
   const pressTime = aggregator._pressTime;
-  const releaseTime = aggregator._releaseTime;
 
   isDown[key] = false;
   eventStartPosition[key] = new Cartesian2();
@@ -219,20 +218,64 @@ function listenMouseButtonDownUp(aggregator, modifier, type) {
 
   aggregator._eventHandler.setInputAction(
     function () {
-      aggregator._buttonsDown = Math.max(aggregator._buttonsDown - 1, 0);
-      isDown[key] = false;
-      releaseTime[key] = new Date();
+      cancelMouseDownAction(getKey(type, undefined), aggregator);
+      for (const modifier of Object.values(KeyboardEventModifier)) {
+        const cancelKey = getKey(type, modifier);
+        cancelMouseDownAction(cancelKey, aggregator);
+      }
     },
     up,
     modifier
   );
 }
 
+function cancelMouseDownAction(cancelKey, aggregator) {
+  const releaseTime = aggregator._releaseTime;
+  const isDown = aggregator._isDown;
+  if (isDown[cancelKey]) {
+    aggregator._buttonsDown = Math.max(aggregator._buttonsDown - 1, 0);
+  }
+  isDown[cancelKey] = false;
+  releaseTime[cancelKey] = new Date();
+}
+
 function cloneMouseMovement(mouseMovement, result) {
   Cartesian2.clone(mouseMovement.startPosition, result.startPosition);
   Cartesian2.clone(mouseMovement.endPosition, result.endPosition);
 }
 
+function refreshMouseDownStatus(type, modifier, aggregator) {
+  // first: Judge if the mouse is pressed
+  const isDown = aggregator._isDown;
+  let anyButtonIsDown = false;
+  const currentKey = getKey(type, modifier);
+  for (const [downKey, downValue] of Object.entries(isDown)) {
+    if (downKey.startsWith(type) && downValue && downKey !== currentKey) {
+      anyButtonIsDown = true;
+      cancelMouseDownAction(downKey, aggregator);
+    }
+  }
+
+  if (!anyButtonIsDown) {
+    return;
+  }
+
+  // second: If it is pressed, it will be transferred to the current modifier.
+  const pressTime = aggregator._pressTime;
+  let lastMovement = aggregator._lastMovement[currentKey];
+  if (!defined(lastMovement)) {
+    lastMovement = aggregator._lastMovement[currentKey] = {
+      startPosition: new Cartesian2(),
+      endPosition: new Cartesian2(),
+      valid: false,
+    };
+  }
+  aggregator._buttonsDown++;
+  lastMovement.valid = false;
+  isDown[currentKey] = true;
+  pressTime[currentKey] = new Date();
+}
+
 function listenMouseMove(aggregator, modifier) {
   const update = aggregator._update;
   const movement = aggregator._movement;
@@ -271,6 +314,7 @@ function listenMouseMove(aggregator, modifier) {
           const type = CameraEventType[typeName];
           if (defined(type)) {
             const key = getKey(type, modifier);
+            refreshMouseDownStatus(type, modifier, aggregator);
             if (isDown[key]) {
               if (!update[key]) {
                 Cartesian2.clone(

package/Source/Scene/Globe.js

@@ -979,7 +979,6 @@ Globe.prototype.beginFrame = function (frameState) {
   const tileProvider = surface.tileProvider;
   const terrainProvider = this.terrainProvider;
   const hasWaterMask =
-    this.showWaterEffect &&
     defined(terrainProvider) &&
     terrainProvider.hasWaterMask &&
     terrainProvider.hasWaterMask;
@@ -1034,6 +1033,7 @@ Globe.prototype.beginFrame = function (frameState) {
     tileProvider.zoomedOutOceanSpecularIntensity =
       mode === SceneMode.SCENE3D ? this._zoomedOutOceanSpecularIntensity : 0.0;
     tileProvider.hasWaterMask = hasWaterMask;
+    tileProvider.showWaterEffect = this.showWaterEffect;
     tileProvider.oceanNormalMap = this._oceanNormalMap;
     tileProvider.enableLighting = this.enableLighting;
     tileProvider.dynamicAtmosphereLighting = this.dynamicAtmosphereLighting;

package/Source/Scene/GlobeSurfaceShaderSet.js

@@ -109,6 +109,7 @@ GlobeSurfaceShaderSet.prototype.getShaderProgram = function (options) {
   const applyAlpha = options.applyAlpha;
   const applyDayNightAlpha = options.applyDayNightAlpha;
   const applySplit = options.applySplit;
+  const hasWaterMask = options.hasWaterMask;
   const showReflectiveOcean = options.showReflectiveOcean;
   const showOceanWaves = options.showOceanWaves;
   const enableLighting = options.enableLighting;
@@ -168,30 +169,31 @@ GlobeSurfaceShaderSet.prototype.getShaderProgram = function (options) {
     (applySaturation << 5) |
     (applyGamma << 6) |
     (applyAlpha << 7) |
-    (showReflectiveOcean << 8) |
-    (showOceanWaves << 9) |
-    (enableLighting << 10) |
-    (dynamicAtmosphereLighting << 11) |
-    (dynamicAtmosphereLightingFromSun << 12) |
-    (showGroundAtmosphere << 13) |
-    (perFragmentGroundAtmosphere << 14) |
-    (hasVertexNormals << 15) |
-    (useWebMercatorProjection << 16) |
-    (enableFog << 17) |
-    (quantization << 18) |
-    (applySplit << 19) |
-    (enableClippingPlanes << 20) |
-    (enableClippingPolygons << 21) |
-    (cartographicLimitRectangleFlag << 22) |
-    (imageryCutoutFlag << 23) |
-    (colorCorrect << 24) |
-    (highlightFillTile << 25) |
-    (colorToAlpha << 26) |
-    (hasGeodeticSurfaceNormals << 27) |
-    (hasExaggeration << 28) |
-    (showUndergroundColor << 29) |
-    (translucent << 30) |
-    (applyDayNightAlpha << 31);
+    (hasWaterMask << 8) |
+    (showReflectiveOcean << 9) |
+    (showOceanWaves << 10) |
+    (enableLighting << 11) |
+    (dynamicAtmosphereLighting << 12) |
+    (dynamicAtmosphereLightingFromSun << 13) |
+    (showGroundAtmosphere << 14) |
+    (perFragmentGroundAtmosphere << 15) |
+    (hasVertexNormals << 16) |
+    (useWebMercatorProjection << 17) |
+    (enableFog << 18) |
+    (quantization << 19) |
+    (applySplit << 20) |
+    (enableClippingPlanes << 21) |
+    (enableClippingPolygons << 22) |
+    (cartographicLimitRectangleFlag << 23) |
+    (imageryCutoutFlag << 24) |
+    (colorCorrect << 25) |
+    (highlightFillTile << 26) |
+    (colorToAlpha << 27) |
+    (hasGeodeticSurfaceNormals << 28) |
+    (hasExaggeration << 29) |
+    (showUndergroundColor << 30) |
+    (translucent << 31) |
+    (applyDayNightAlpha << 32);
 
   let currentClippingShaderState = 0;
   if (defined(clippingPlanes) && clippingPlanes.length > 0) {
@@ -279,6 +281,9 @@ GlobeSurfaceShaderSet.prototype.getShaderProgram = function (options) {
     if (applyDayNightAlpha) {
       fs.defines.push("APPLY_DAY_NIGHT_ALPHA");
     }
+    if (hasWaterMask) {
+      fs.defines.push("HAS_WATER_MASK");
+    }
     if (showReflectiveOcean) {
       fs.defines.push("SHOW_REFLECTIVE_OCEAN");
       vs.defines.push("SHOW_REFLECTIVE_OCEAN");

package/Source/Scene/GlobeSurfaceTileProvider.js

@@ -83,6 +83,7 @@ function GlobeSurfaceTileProvider(options) {
   this.lightingFadeOutDistance = 6500000.0;
   this.lightingFadeInDistance = 9000000.0;
   this.hasWaterMask = false;
+  this.showWaterEffect = false;
   this.oceanNormalMap = undefined;
   this.zoomedOutOceanSpecularIntensity = 0.5;
   this.enableLighting = false;
@@ -2181,8 +2182,8 @@ function addDrawCommandsForTile(tileProvider, tile, frameState) {
   const lambertDiffuseMultiplier = tileProvider.lambertDiffuseMultiplier;
   const vertexShadowDarkness = tileProvider.vertexShadowDarkness;
 
-  const showReflectiveOcean =
-    tileProvider.hasWaterMask && defined(waterMaskTexture);
+  const hasWaterMask = tileProvider.hasWaterMask && defined(waterMaskTexture);
+  const showReflectiveOcean = hasWaterMask && tileProvider.showWaterEffect;
   const oceanNormalMap = tileProvider.oceanNormalMap;
   const showOceanWaves = showReflectiveOcean && defined(oceanNormalMap);
   const terrainProvider = tileProvider.terrainProvider;
@@ -2214,7 +2215,7 @@ function addDrawCommandsForTile(tileProvider, tile, frameState) {
     perFragmentGroundAtmosphere = cameraDistance > fadeOutDistance;
   }
 
-  if (showReflectiveOcean) {
+  if (hasWaterMask) {
     --maxTextures;
   }
   if (showOceanWaves) {
@@ -2329,6 +2330,7 @@ function addDrawCommandsForTile(tileProvider, tile, frameState) {
   const surfaceShaderSetOptions = surfaceShaderSetOptionsScratch;
   surfaceShaderSetOptions.frameState = frameState;
   surfaceShaderSetOptions.surfaceTile = surfaceTile;
+  surfaceShaderSetOptions.hasWaterMask = hasWaterMask;
   surfaceShaderSetOptions.showReflectiveOcean = showReflectiveOcean;
   surfaceShaderSetOptions.showOceanWaves = showOceanWaves;
   surfaceShaderSetOptions.enableLighting = tileProvider.enableLighting;

package/Source/Scene/ImageBasedLighting.js

@@ -4,7 +4,7 @@ import defined from "../Core/defined.js";
 import defaultValue from "../Core/defaultValue.js";
 import destroyObject from "../Core/destroyObject.js";
 import DeveloperError from "../Core/DeveloperError.js";
-import OctahedralProjectedCubeMap from "./OctahedralProjectedCubeMap.js";
+import SpecularEnvironmentCubeMap from "./SpecularEnvironmentCubeMap.js";
 
 /**
  * Properties for managing image-based lighting on tilesets and models.
@@ -84,8 +84,8 @@ function ImageBasedLighting(options) {
 
   // The specular environment map texture is created in update();
   this._specularEnvironmentMaps = options.specularEnvironmentMaps;
-  this._specularEnvironmentMapAtlas = undefined;
-  this._specularEnvironmentMapAtlasDirty = true;
+  this._specularEnvironmentCubeMap = undefined;
+  this._specularEnvironmentCubeMapDirty = true;
   this._specularEnvironmentMapLoaded = false;
   this._previousSpecularEnvironmentMapLoaded = false;
 
@@ -226,8 +226,8 @@ Object.defineProperties(ImageBasedLighting.prototype, {
     },
     set: function (value) {
       if (value !== this._specularEnvironmentMaps) {
-        this._specularEnvironmentMapAtlasDirty =
-          this._specularEnvironmentMapAtlasDirty ||
+        this._specularEnvironmentCubeMapDirty =
+          this._specularEnvironmentCubeMapDirty ||
           value !== this._specularEnvironmentMaps;
         this._specularEnvironmentMapLoaded = false;
       }
@@ -299,16 +299,16 @@ Object.defineProperties(ImageBasedLighting.prototype, {
   },
 
   /**
-   * The texture atlas for the specular environment maps.
+   * The cube map for the specular environment maps.
    *
    * @memberof ImageBasedLighting.prototype
-   * @type {OctahedralProjectedCubeMap}
+   * @type {SpecularEnvironmentCubeMap}
    *
    * @private
    */
-  specularEnvironmentMapAtlas: {
+  specularEnvironmentCubeMap: {
     get: function () {
-      return this._specularEnvironmentMapAtlas;
+      return this._specularEnvironmentCubeMap;
     },
   },
 
@@ -337,30 +337,30 @@ Object.defineProperties(ImageBasedLighting.prototype, {
   useSpecularEnvironmentMaps: {
     get: function () {
       return (
-        (defined(this._specularEnvironmentMapAtlas) &&
-          this._specularEnvironmentMapAtlas.ready) ||
+        (defined(this._specularEnvironmentCubeMap) &&
+          this._specularEnvironmentCubeMap.ready) ||
         this._useDefaultSpecularMaps
       );
     },
   },
 });
 
-function createSpecularEnvironmentMapAtlas(imageBasedLighting, context) {
-  if (!OctahedralProjectedCubeMap.isSupported(context)) {
+function createSpecularEnvironmentCubeMap(imageBasedLighting, context) {
+  if (!SpecularEnvironmentCubeMap.isSupported(context)) {
     return;
   }
 
-  imageBasedLighting._specularEnvironmentMapAtlas =
-    imageBasedLighting._specularEnvironmentMapAtlas &&
-    imageBasedLighting._specularEnvironmentMapAtlas.destroy();
+  imageBasedLighting._specularEnvironmentCubeMap =
+    imageBasedLighting._specularEnvironmentCubeMap &&
+    imageBasedLighting._specularEnvironmentCubeMap.destroy();
 
   if (defined(imageBasedLighting._specularEnvironmentMaps)) {
-    const atlas = new OctahedralProjectedCubeMap(
+    const cubeMap = new SpecularEnvironmentCubeMap(
       imageBasedLighting._specularEnvironmentMaps
     );
-    imageBasedLighting._specularEnvironmentMapAtlas = atlas;
+    imageBasedLighting._specularEnvironmentCubeMap = cubeMap;
 
-    imageBasedLighting._removeErrorListener = atlas.errorEvent.addEventListener(
+    imageBasedLighting._removeErrorListener = cubeMap.errorEvent.addEventListener(
       (error) => {
         console.error(`Error loading specularEnvironmentMaps: ${error}`);
       }
@@ -428,23 +428,23 @@ ImageBasedLighting.prototype.update = function (frameState) {
 
   this._previousSpecularEnvironmentMapLoaded = this._specularEnvironmentMapLoaded;
 
-  if (this._specularEnvironmentMapAtlasDirty) {
-    createSpecularEnvironmentMapAtlas(this, context);
-    this._specularEnvironmentMapAtlasDirty = false;
+  if (this._specularEnvironmentCubeMapDirty) {
+    createSpecularEnvironmentCubeMap(this, context);
+    this._specularEnvironmentCubeMapDirty = false;
   }
 
-  if (defined(this._specularEnvironmentMapAtlas)) {
-    this._specularEnvironmentMapAtlas.update(frameState);
-    if (this._specularEnvironmentMapAtlas.ready) {
+  if (defined(this._specularEnvironmentCubeMap)) {
+    this._specularEnvironmentCubeMap.update(frameState);
+    if (this._specularEnvironmentCubeMap.ready) {
       this._specularEnvironmentMapLoaded = true;
     }
   }
 
-  const recompileWithDefaultAtlas =
-    !defined(this._specularEnvironmentMapAtlas) &&
+  const recompileWithDefaultCubeMap =
+    !defined(this._specularEnvironmentCubeMap) &&
     defined(frameState.specularEnvironmentMaps) &&
     !this._useDefaultSpecularMaps;
-  const recompileWithoutDefaultAtlas =
+  const recompileWithoutDefaultCubeMap =
     !defined(frameState.specularEnvironmentMaps) &&
     this._useDefaultSpecularMaps;
 
@@ -458,13 +458,13 @@ ImageBasedLighting.prototype.update = function (frameState) {
 
   this._shouldRegenerateShaders =
     this._shouldRegenerateShaders ||
-    recompileWithDefaultAtlas ||
-    recompileWithoutDefaultAtlas ||
+    recompileWithDefaultCubeMap ||
+    recompileWithoutDefaultCubeMap ||
     recompileWithDefaultSHCoeffs ||
     recompileWithoutDefaultSHCoeffs;
 
   this._useDefaultSpecularMaps =
-    !defined(this._specularEnvironmentMapAtlas) &&
+    !defined(this._specularEnvironmentCubeMap) &&
     defined(frameState.specularEnvironmentMaps);
   this._useDefaultSphericalHarmonics =
     !defined(this._sphericalHarmonicCoefficients) &&
@@ -503,9 +503,9 @@ ImageBasedLighting.prototype.isDestroyed = function () {
  * @private
  */
 ImageBasedLighting.prototype.destroy = function () {
-  this._specularEnvironmentMapAtlas =
-    this._specularEnvironmentMapAtlas &&
-    this._specularEnvironmentMapAtlas.destroy();
+  this._specularEnvironmentCubeMap =
+    this._specularEnvironmentCubeMap &&
+    this._specularEnvironmentCubeMap.destroy();
   this._removeErrorListener =
     this._removeErrorListener && this._removeErrorListener();
   return destroyObject(this);

package/Source/Scene/Label.js

@@ -102,8 +102,8 @@ function parseFont(label) {
  * @property {Cartesian2} [backgroundPadding=new Cartesian2(7, 5)] A {@link Cartesian2} Specifying the horizontal and vertical background padding in pixels.
  * @property {Cartesian2} [pixelOffset=Cartesian2.ZERO] A {@link Cartesian2} specifying the pixel offset in screen space from the origin of this label.
  * @property {Cartesian3} [eyeOffset=Cartesian3.ZERO] A {@link Cartesian3} specifying the 3D Cartesian offset applied to this label in eye coordinates.
- * @property {HorizontalOrigin} [horizontalOrigin=HorizontalOrigin.CENTER] A {@link HorizontalOrigin} specifying the horizontal origin of this label.
- * @property {VerticalOrigin} [verticalOrigin=VerticalOrigin.CENTER] A {@link VerticalOrigin} specifying the vertical origin of this label.
+ * @property {HorizontalOrigin} [horizontalOrigin=HorizontalOrigin.LEFT] A {@link HorizontalOrigin} specifying the horizontal origin of this label.
+ * @property {VerticalOrigin} [verticalOrigin=VerticalOrigin.BASELINE] A {@link VerticalOrigin} specifying the vertical origin of this label.
  * @property {HeightReference} [heightReference=HeightReference.NONE] A {@link HeightReference} specifying the height reference of this label.
  * @property {Color} [fillColor=Color.WHITE] A {@link Color} specifying the fill color of the label.
  * @property {Color} [outlineColor=Color.BLACK] A {@link Color} specifying the outline color of the label.

package/Source/Scene/Material.js

@@ -34,6 +34,7 @@ import SlopeRampMaterial from "../Shaders/Materials/SlopeRampMaterial.js";
 import StripeMaterial from "../Shaders/Materials/StripeMaterial.js";
 import TextureMagnificationFilter from "../Renderer/TextureMagnificationFilter.js";
 import TextureMinificationFilter from "../Renderer/TextureMinificationFilter.js";
+import WaterMaskMaterial from "../Shaders/Materials/WaterMaskMaterial.js";
 import WaterMaterial from "../Shaders/Materials/Water.js";
 
 /**
@@ -219,6 +220,11 @@ import WaterMaterial from "../Shaders/Materials/Water.js";
  *      <li><code>heights</code>: image of heights sorted from lowest to highest.</li>
  *      <li><code>colors</code>: image of colors at the corresponding heights.</li>
  * </ul>
+ * <li>WaterMask</li>
+ * <ul>
+ *      <li><code>waterColor</code>: diffuse color and alpha for the areas covered by water.</li>
+ *      <li><code>landColor</code>: diffuse color and alpha for the areas covered by land.</li>
+ * </ul>
  * </ul>
  * </ul>
  * </div>
@@ -233,7 +239,6 @@ import WaterMaterial from "../Shaders/Materials/Water.js";
  * @param {TextureMinificationFilter} [options.minificationFilter=TextureMinificationFilter.LINEAR] The {@link TextureMinificationFilter} to apply to this material's textures.
  * @param {TextureMagnificationFilter} [options.magnificationFilter=TextureMagnificationFilter.LINEAR] The {@link TextureMagnificationFilter} to apply to this material's textures.
  * @param {object} options.fabric The fabric JSON used to generate the material.
- *ructor
  *
  * @exception {DeveloperError} fabric: uniform has invalid type.
  * @exception {DeveloperError} fabric: uniforms and materials cannot share the same property.
@@ -245,7 +250,6 @@ import WaterMaterial from "../Shaders/Materials/Water.js";
  * @exception {DeveloperError} strict: shader source does not use material.
  *
  * @see {@link https://github.com/CesiumGS/cesium/wiki/Fabric|Fabric wiki page} for a more detailed options of Fabric.
- *
  * @demo {@link https://sandcastle.cesium.com/index.html?src=Materials.html|Cesium Sandcastle Materials Demo}
  *
  * @example
@@ -1739,4 +1743,22 @@ Material._materialCache.addMaterial(Material.ElevationBandType, {
   translucent: true,
 });
 
+/**
+ * Gets the name of the water mask material.
+ * @type {string}
+ * @readonly
+ */
+Material.WaterMaskType = "WaterMask";
+Material._materialCache.addMaterial(Material.WaterMaskType, {
+  fabric: {
+    type: Material.WaterMaskType,
+    source: WaterMaskMaterial,
+    uniforms: {
+      waterColor: new Color(1.0, 1.0, 1.0, 1.0),
+      landColor: new Color(0.0, 0.0, 0.0, 0.0),
+    },
+  },
+  translucent: false,
+});
+
 export default Material;

package/Source/Scene/Model/ImageBasedLightingPipelineStage.js

@@ -2,7 +2,7 @@ import combine from "../../Core/combine.js";
 import defined from "../../Core/defined.js";
 import ImageBasedLightingStageFS from "../../Shaders/Model/ImageBasedLightingStageFS.js";
 import ShaderDestination from "../../Renderer/ShaderDestination.js";
-import OctahedralProjectedCubeMap from "../OctahedralProjectedCubeMap.js";
+import SpecularEnvironmentCubeMap from "../SpecularEnvironmentCubeMap.js";
 
 const ImageBasedLightingPipelineStage = {
   name: "ImageBasedLightingPipelineStage", // Helps with debugging
@@ -34,7 +34,7 @@ ImageBasedLightingPipelineStage.process = function (
     ShaderDestination.FRAGMENT
   );
 
-  if (OctahedralProjectedCubeMap.isSupported(frameState.context)) {
+  if (SpecularEnvironmentCubeMap.isSupported(frameState.context)) {
     const addMatrix =
       imageBasedLighting.useSphericalHarmonics ||
       imageBasedLighting.useSpecularEnvironmentMaps ||
@@ -72,8 +72,8 @@ ImageBasedLightingPipelineStage.process = function (
     }
 
     if (
-      defined(imageBasedLighting.specularEnvironmentMapAtlas) &&
-      imageBasedLighting.specularEnvironmentMapAtlas.ready
+      defined(imageBasedLighting.specularEnvironmentCubeMap) &&
+      imageBasedLighting.specularEnvironmentCubeMap.ready
     ) {
       shaderBuilder.addDefine(
         "SPECULAR_IBL",
@@ -86,15 +86,10 @@ ImageBasedLightingPipelineStage.process = function (
         ShaderDestination.FRAGMENT
       );
       shaderBuilder.addUniform(
-        "sampler2D",
+        "samplerCube",
         "model_specularEnvironmentMaps",
         ShaderDestination.FRAGMENT
       );
-      shaderBuilder.addUniform(
-        "vec2",
-        "model_specularEnvironmentMapsSize",
-        ShaderDestination.FRAGMENT
-      );
       shaderBuilder.addUniform(
         "float",
         "model_specularEnvironmentMapsMaximumLOD",
@@ -138,13 +133,10 @@ ImageBasedLightingPipelineStage.process = function (
       return imageBasedLighting.sphericalHarmonicCoefficients;
     },
     model_specularEnvironmentMaps: function () {
-      return imageBasedLighting.specularEnvironmentMapAtlas.texture;
-    },
-    model_specularEnvironmentMapsSize: function () {
-      return imageBasedLighting.specularEnvironmentMapAtlas.texture.dimensions;
+      return imageBasedLighting.specularEnvironmentCubeMap.texture;
     },
     model_specularEnvironmentMapsMaximumLOD: function () {
-      return imageBasedLighting.specularEnvironmentMapAtlas.maximumMipmapLevel;
+      return imageBasedLighting.specularEnvironmentCubeMap.maximumMipmapLevel;
     },
   };