@cesium/engine 20.0.1 → 21.0.0

package/Source/DataSources/KmlDataSource.js

@@ -42,7 +42,13 @@ import LabelStyle from "../Scene/LabelStyle.js";
 import SceneMode from "../Scene/SceneMode.js";
 import Autolinker from "autolinker";
 import Uri from "urijs";
-import * as zip from "@zip.js/zip.js/lib/zip-no-worker.js";
+import {
+  configure,
+  BlobReader,
+  Data64URIWriter,
+  TextWriter,
+  ZipReader,
+} from "@zip.js/zip.js/lib/zip-core.js";
 import getElement from "./getElement.js";
 import BillboardGraphics from "./BillboardGraphics.js";
 import CompositePositionProperty from "./CompositePositionProperty.js";
@@ -390,24 +396,18 @@ function removeDuplicateNamespaces(text) {
   return text;
 }
 
-function loadXmlFromZip(entry, uriResolver) {
-  return Promise.resolve(entry.getData(new zip.TextWriter())).then(
-    function (text) {
-      text = insertNamespaces(text);
-      text = removeDuplicateNamespaces(text);
-      uriResolver.kml = parser.parseFromString(text, "application/xml");
-    },
-  );
+async function loadXmlFromZip(entry, uriResolver) {
+  let text = await entry.getData(new TextWriter());
+  text = insertNamespaces(text);
+  text = removeDuplicateNamespaces(text);
+  uriResolver.kml = parser.parseFromString(text, "application/xml");
 }
 
-function loadDataUriFromZip(entry, uriResolver) {
+async function loadDataUriFromZip(entry, uriResolver) {
   const mimeType =
     MimeTypes.detectFromFilename(entry.filename) ?? "application/octet-stream";
-  return Promise.resolve(entry.getData(new zip.Data64URIWriter(mimeType))).then(
-    function (dataUri) {
-      uriResolver[entry.filename] = dataUri;
-    },
-  );
+  const dataUri = await entry.getData(new Data64URIWriter(mimeType));
+  uriResolver[entry.filename] = dataUri;
 }
 
 function embedDataUris(div, elementType, attributeName, uriResolver) {
@@ -3287,69 +3287,68 @@ function loadKml(
   });
 }
 
-function loadKmz(
+async function loadKmz(
   dataSource,
   entityCollection,
   blob,
   sourceResource,
   screenOverlayContainer,
 ) {
-  const zWorkerUrl = buildModuleUrl("ThirdParty/Workers/z-worker-pako.js");
-  zip.configure({
-    workerScripts: {
-      deflate: [zWorkerUrl, "./pako_deflate.min.js"],
-      inflate: [zWorkerUrl, "./pako_inflate.min.js"],
-    },
+  const zWorkerUri = buildModuleUrl("ThirdParty/Workers/zip-web-worker.js");
+  const zWasmUri = buildModuleUrl("ThirdParty/zip-module.wasm");
+  configure({
+    workerURI: zWorkerUri,
+    wasmURI: zWasmUri,
   });
 
-  const reader = new zip.ZipReader(new zip.BlobReader(blob));
-  return Promise.resolve(reader.getEntries()).then(function (entries) {
-    const promises = [];
-    const uriResolver = {};
-    let docEntry;
-    for (let i = 0; i < entries.length; i++) {
-      const entry = entries[i];
-      if (!entry.directory) {
-        if (/\.kml$/i.test(entry.filename)) {
-          // We use the first KML document we come across
-          //  https://developers.google.com/kml/documentation/kmzarchives
-          // Unless we come across a .kml file at the root of the archive because GE does this
-          if (!defined(docEntry) || !/\//i.test(entry.filename)) {
-            if (defined(docEntry)) {
-              // We found one at the root so load the initial kml as a data uri
-              promises.push(loadDataUriFromZip(docEntry, uriResolver));
-            }
-            docEntry = entry;
-          } else {
-            // Wasn't the first kml and wasn't at the root
-            promises.push(loadDataUriFromZip(entry, uriResolver));
+  const reader = new ZipReader(new BlobReader(blob));
+  const entries = await reader.getEntries();
+
+  const promises = [];
+  const uriResolver = {};
+  let docEntry;
+  for (let i = 0; i < entries.length; i++) {
+    const entry = entries[i];
+    if (!entry.directory) {
+      if (/\.kml$/i.test(entry.filename)) {
+        // We use the first KML document we come across
+        //  https://developers.google.com/kml/documentation/kmzarchives
+        // Unless we come across a .kml file at the root of the archive because GE does this
+        if (!defined(docEntry) || !/\//i.test(entry.filename)) {
+          if (defined(docEntry)) {
+            // We found one at the root so load the initial kml as a data uri
+            promises.push(loadDataUriFromZip(docEntry, uriResolver));
           }
+          docEntry = entry;
         } else {
+          // Wasn't the first kml and wasn't at the root
           promises.push(loadDataUriFromZip(entry, uriResolver));
         }
+      } else {
+        promises.push(loadDataUriFromZip(entry, uriResolver));
       }
     }
+  }
 
-    // Now load the root KML document
-    if (defined(docEntry)) {
-      promises.push(loadXmlFromZip(docEntry, uriResolver));
-    }
-    return Promise.all(promises).then(function () {
-      reader.close();
-      if (!defined(uriResolver.kml)) {
-        throw new RuntimeError("KMZ file does not contain a KML document.");
-      }
-      uriResolver.keys = Object.keys(uriResolver);
-      return loadKml(
-        dataSource,
-        entityCollection,
-        uriResolver.kml,
-        sourceResource,
-        uriResolver,
-        screenOverlayContainer,
-      );
-    });
-  });
+  // Now load the root KML document
+  if (defined(docEntry)) {
+    promises.push(loadXmlFromZip(docEntry, uriResolver));
+  }
+  await Promise.all(promises);
+  reader.close();
+  if (!defined(uriResolver.kml)) {
+    throw new RuntimeError("KMZ file does not contain a KML document.");
+  }
+  uriResolver.keys = Object.keys(uriResolver);
+
+  return loadKml(
+    dataSource,
+    entityCollection,
+    uriResolver.kml,
+    sourceResource,
+    uriResolver,
+    screenOverlayContainer,
+  );
 }
 
 function load(dataSource, entityCollection, data, options) {

package/Source/DataSources/exportKml.js

@@ -20,7 +20,13 @@ import TimeIntervalCollection from "../Core/TimeIntervalCollection.js";
 import HeightReference from "../Scene/HeightReference.js";
 import HorizontalOrigin from "../Scene/HorizontalOrigin.js";
 import VerticalOrigin from "../Scene/VerticalOrigin.js";
-import * as zip from "@zip.js/zip.js/lib/zip-no-worker.js";
+import {
+  configure,
+  BlobReader,
+  BlobWriter,
+  TextReader,
+  ZipWriter,
+} from "@zip.js/zip.js/lib/zip-core.js";
 import BillboardGraphics from "./BillboardGraphics.js";
 import CompositePositionProperty from "./CompositePositionProperty.js";
 import ModelGraphics from "./ModelGraphics.js";
@@ -322,43 +328,34 @@ function exportKml(options) {
   });
 }
 
-function createKmz(kmlString, externalFiles) {
-  const zWorkerUrl = buildModuleUrl("ThirdParty/Workers/z-worker-pako.js");
-  zip.configure({
-    workerScripts: {
-      deflate: [zWorkerUrl, "./pako_deflate.min.js"],
-      inflate: [zWorkerUrl, "./pako_inflate.min.js"],
-    },
+async function createKmz(kmlString, externalFiles) {
+  const zWorkerUri = buildModuleUrl("ThirdParty/Workers/zip-web-worker.js");
+  const zWasmUri = buildModuleUrl("ThirdParty/zip-module.wasm");
+  configure({
+    workerURI: zWorkerUri,
+    wasmURI: zWasmUri,
   });
-  const blobWriter = new zip.BlobWriter();
-  const writer = new zip.ZipWriter(blobWriter);
+  const blobWriter = new BlobWriter("application/vnd.google-earth.kmz");
+  const writer = new ZipWriter(blobWriter);
+
   // We need to only write one file at a time so the zip doesn't get corrupted
-  return writer
-    .add("doc.kml", new zip.TextReader(kmlString))
-    .then(function () {
-      const keys = Object.keys(externalFiles);
-      return addExternalFilesToZip(writer, keys, externalFiles, 0);
-    })
-    .then(function () {
-      return writer.close();
-    })
-    .then(function (blob) {
-      return {
-        kmz: blob,
-      };
-    });
+  await writer.add("doc.kml", new TextReader(kmlString));
+  const keys = Object.keys(externalFiles);
+  await addExternalFilesToZip(writer, keys, externalFiles, 0);
+  await writer.close();
+  const blob = await blobWriter.getData();
+  return {
+    kmz: blob,
+  };
 }
 
-function addExternalFilesToZip(writer, keys, externalFiles, index) {
+async function addExternalFilesToZip(writer, keys, externalFiles, index) {
   if (keys.length === index) {
     return;
   }
   const filename = keys[index];
-  return writer
-    .add(filename, new zip.BlobReader(externalFiles[filename]))
-    .then(function () {
-      return addExternalFilesToZip(writer, keys, externalFiles, index + 1);
-    });
+  await writer.add(filename, new BlobReader(externalFiles[filename]));
+  return addExternalFilesToZip(writer, keys, externalFiles, index + 1);
 }
 
 exportKml._createState = function (options) {

package/Source/Scene/ArcGisMapService.js

@@ -4,7 +4,7 @@ import Resource from "../Core/Resource.js";
 
 let defaultTokenCredit;
 const defaultAccessToken =
-  "AAPTxy8BH1VEsoebNVZXo8HurEOF051kAEKlhkOhBEc9BmRXcPUeuOd6ZTh-Z86vRv6teqZdBYLUWIxB6HTYajPhFtAlXhMdqTg07UwlBQ59KbiReC5wCeOF4LzLTW4oaSPp-t4pEcJHnFePlnFcIPXM7R565gTy6f6fMuZAXPvUEuZSMf8dvTqHyV9-Zd9eZGWokDzKC4uEtHME7OeAk3oyZ7vzkjEo8fpuIfFw0sH8vQU.AT1_PLgWE6Lc";
+  "AAPTxy8BH1VEsoebNVZXo8HurEOF051kAEKlhkOhBEc9BmQqEeLjCLZBBnNm_y_K-Cs-tuPcsgUmlxDWvPdTmGIEhrihfZMTG77j2nmCeqeYCPAenHGG1YfJqJaeRLuy5YjARJcFLP2I_judomiDS-8A_LVZxWUObwIQNE5wcsQKxJl7RHiKm-81XRDuUJZXGqy9B4PwPxWkS-N9PZ7NmTT-sP6BOGn5ouiAN8dkxwNx3tA.AT1_BU0Co4D8";
 /**
  * Default options for accessing the ArcGIS image tile service.
  *

package/Source/Scene/Azure2DImageryProvider.js

@@ -0,0 +1,308 @@
+import Check from "../Core/Check.js";
+import Credit from "../Core/Credit.js";
+import defined from "../Core/defined.js";
+import Resource from "../Core/Resource.js";
+import IonResource from "../Core/IonResource.js";
+import UrlTemplateImageryProvider from "./UrlTemplateImageryProvider.js";
+
+const trailingSlashRegex = /\/$/;
+
+/**
+ * @typedef {object} Azure2DImageryProvider.ConstructorOptions
+ *
+ * Initialization options for the Azure2DImageryProvider constructor
+ *
+ * @property {object} options Object with the following properties:
+ * @property {string} [options.url="https://atlas.microsoft.com/"] The Azure server url.
+ * @property {string} [options.tilesetId="microsoft.imagery"] The Azure tileset ID. Valid options are {@link microsoft.imagery}, {@link microsoft.base.road}, and {@link microsoft.base.labels.road}
+ * @property {string} options.subscriptionKey The public subscription key for the imagery.
+ * @property {Ellipsoid} [options.ellipsoid=Ellipsoid.default] The ellipsoid.  If not specified, the default ellipsoid is used.
+ * @property {number} [options.minimumLevel=0] The minimum level-of-detail supported by the imagery provider.  Take care when specifying
+ *                 this that the number of tiles at the minimum level is small, such as four or less.  A larger number is likely
+ *                 to result in rendering problems.
+ * @property {number} [options.maximumLevel=22] The maximum level-of-detail supported by the imagery provider.
+ * @property {Rectangle} [options.rectangle=Rectangle.MAX_VALUE] The rectangle, in radians, covered by the image.
+ */
+
+/**
+ * Provides 2D image tiles from Azure.
+ *
+ * @alias Azure2DImageryProvider
+ * @constructor
+ * @private
+ * @param {Azure2DImageryProvider.ConstructorOptions} options Object describing initialization options
+ *
+ * @example
+ * // Azure 2D imagery provider
+ * const azureImageryProvider = new Cesium.Azure2DImageryProvider({
+ *     subscriptionKey: "subscription-key",
+ *     tilesetId: "microsoft.base.road"
+ * });
+ */
+function Azure2DImageryProvider(options) {
+  options = options ?? {};
+  options.maximumLevel = options.maximumLevel ?? 22;
+  options.minimumLevel = options.minimumLevel ?? 0;
+
+  const subscriptionKey =
+    options.subscriptionKey ?? options["subscription-key"];
+  //>>includeStart('debug', pragmas.debug);
+  Check.defined("options.tilesetId", options.tilesetId);
+  Check.defined("options.subscriptionKey", subscriptionKey);
+  //>>includeEnd('debug');
+
+  const resource =
+    options.url instanceof IonResource
+      ? options.url
+      : Resource.createIfNeeded(options.url ?? "https://atlas.microsoft.com/");
+
+  let templateUrl = resource.getUrlComponent();
+  if (!trailingSlashRegex.test(templateUrl)) {
+    templateUrl += "/";
+  }
+  templateUrl += `map/tile`;
+
+  resource.url = templateUrl;
+
+  resource.setQueryParameters({
+    "api-version": "2024-04-01",
+    tilesetId: options.tilesetId,
+    zoom: `{z}`,
+    x: `{x}`,
+    y: `{y}`,
+    "subscription-key": subscriptionKey,
+  });
+
+  let credit;
+  if (defined(options.credit)) {
+    credit = options.credit;
+    if (typeof credit === "string") {
+      credit = new Credit(credit);
+    }
+  }
+
+  const provider = new UrlTemplateImageryProvider({
+    ...options,
+    url: resource,
+    credit: credit,
+  });
+  provider._resource = resource;
+  this._imageryProvider = provider;
+
+  // This will be defined for ion resources
+  this._tileCredits = resource.credits;
+}
+
+Object.defineProperties(Azure2DImageryProvider.prototype, {
+  /**
+   * Gets the URL of the Azure 2D Imagery server.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {string}
+   * @readonly
+   */
+  url: {
+    get: function () {
+      return this._imageryProvider.url;
+    },
+  },
+
+  /**
+   * Gets the rectangle, in radians, of the imagery provided by the instance.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {Rectangle}
+   * @readonly
+   */
+  rectangle: {
+    get: function () {
+      return this._imageryProvider.rectangle;
+    },
+  },
+
+  /**
+   * Gets the width of each tile, in pixels.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {number}
+   * @readonly
+   */
+  tileWidth: {
+    get: function () {
+      return this._imageryProvider.tileWidth;
+    },
+  },
+
+  /**
+   * Gets the height of each tile, in pixels.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {number}
+   * @readonly
+   */
+  tileHeight: {
+    get: function () {
+      return this._imageryProvider.tileHeight;
+    },
+  },
+
+  /**
+   * Gets the maximum level-of-detail that can be requested.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {number|undefined}
+   * @readonly
+   */
+  maximumLevel: {
+    get: function () {
+      return this._imageryProvider.maximumLevel;
+    },
+  },
+
+  /**
+   * Gets the minimum level-of-detail that can be requested. Generally,
+   * a minimum level should only be used when the rectangle of the imagery is small
+   * enough that the number of tiles at the minimum level is small.  An imagery
+   * provider with more than a few tiles at the minimum level will lead to
+   * rendering problems.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {number}
+   * @readonly
+   */
+  minimumLevel: {
+    get: function () {
+      return this._imageryProvider.minimumLevel;
+    },
+  },
+
+  /**
+   * Gets the tiling scheme used by the provider.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {TilingScheme}
+   * @readonly
+   */
+  tilingScheme: {
+    get: function () {
+      return this._imageryProvider.tilingScheme;
+    },
+  },
+
+  /**
+   * Gets the tile discard policy.  If not undefined, the discard policy is responsible
+   * for filtering out "missing" tiles via its shouldDiscardImage function.  If this function
+   * returns undefined, no tiles are filtered.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {TileDiscardPolicy}
+   * @readonly
+   */
+  tileDiscardPolicy: {
+    get: function () {
+      return this._imageryProvider.tileDiscardPolicy;
+    },
+  },
+
+  /**
+   * Gets an event that is raised when the imagery provider encounters an asynchronous error..  By subscribing
+   * to the event, you will be notified of the error and can potentially recover from it.  Event listeners
+   * are passed an instance of {@link TileProviderError}.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {Event}
+   * @readonly
+   */
+  errorEvent: {
+    get: function () {
+      return this._imageryProvider.errorEvent;
+    },
+  },
+
+  /**
+   * Gets the credit to display when this imagery provider is active.  Typically this is used to credit
+   * the source of the imagery.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {Credit}
+   * @readonly
+   */
+  credit: {
+    get: function () {
+      return this._imageryProvider.credit;
+    },
+  },
+
+  /**
+   * Gets the proxy used by this provider.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {Proxy}
+   * @readonly
+   */
+  proxy: {
+    get: function () {
+      return this._imageryProvider.proxy;
+    },
+  },
+
+  /**
+   * Gets a value indicating whether or not the images provided by this imagery provider
+   * include an alpha channel.  If this property is false, an alpha channel, if present, will
+   * be ignored.  If this property is true, any images without an alpha channel will be treated
+   * as if their alpha is 1.0 everywhere.  When this property is false, memory usage
+   * and texture upload time are reduced.
+   * @memberof Azure2DImageryProvider.prototype
+   * @type {boolean}
+   * @readonly
+   */
+  hasAlphaChannel: {
+    get: function () {
+      return this._imageryProvider.hasAlphaChannel;
+    },
+  },
+});
+
+/**
+ * Gets the credits to be displayed when a given tile is displayed.
+ *
+ * @param {number} x The tile X coordinate.
+ * @param {number} y The tile Y coordinate.
+ * @param {number} level The tile level;
+ * @returns {Credit[]|undefined} The credits to be displayed when the tile is displayed.
+ */
+Azure2DImageryProvider.prototype.getTileCredits = function (x, y, level) {
+  return this._imageryProvider.getTileCredits(x, y, level);
+};
+
+/**
+ * Requests the image for a given tile.
+ *
+ * @param {number} x The tile X coordinate.
+ * @param {number} y The tile Y coordinate.
+ * @param {number} level The tile level.
+ * @param {Request} [request] The request object. Intended for internal use only.
+ * @returns {Promise<ImageryTypes>|undefined} A promise for the image that will resolve when the image is available, or
+ *          undefined if there are too many active requests to the server, and the request should be retried later.
+ */
+Azure2DImageryProvider.prototype.requestImage = function (
+  x,
+  y,
+  level,
+  request,
+) {
+  return this._imageryProvider.requestImage(x, y, level, request);
+};
+
+/**
+ * Picking features is not currently supported by this imagery provider, so this function simply returns
+ * undefined.
+ *
+ * @param {number} x The tile X coordinate.
+ * @param {number} y The tile Y coordinate.
+ * @param {number} level The tile level.
+ * @param {number} longitude The longitude at which to pick features.
+ * @param {number} latitude  The latitude at which to pick features.
+ * @return {undefined} Undefined since picking is not supported.
+ */
+Azure2DImageryProvider.prototype.pickFeatures = function (
+  x,
+  y,
+  level,
+  longitude,
+  latitude,
+) {
+  return undefined;
+};
+
+// Exposed for tests
+export default Azure2DImageryProvider;

package/Source/Scene/BatchTableHierarchy.js

@@ -6,7 +6,7 @@ import ComponentDatatype from "../Core/ComponentDatatype.js";
 import defined from "../Core/defined.js";
 import DeveloperError from "../Core/DeveloperError.js";
 import getBinaryAccessor from "./getBinaryAccessor.js";
-import RuntimeError from "../Core/RuntimeError.js";
+import Cesium3DTileBatchTable from "./Cesium3DTileBatchTable.js";
 
 /**
  * Object for handling the <code>3DTILES_batch_table_hierarchy</code> extension
@@ -127,7 +127,7 @@ function initialize(hierarchy, hierarchyJson, binaryBody) {
   for (i = 0; i < classesLength; ++i) {
     const classInstancesLength = classes[i].length;
     const properties = classes[i].instances;
-    const binaryProperties = getBinaryProperties(
+    const binaryProperties = Cesium3DTileBatchTable.getBinaryProperties(
       classInstancesLength,
       properties,
       binaryBody,
@@ -154,54 +154,6 @@ function initialize(hierarchy, hierarchyJson, binaryBody) {
   hierarchy._byteLength = byteLength;
 }
 
-function getBinaryProperties(featuresLength, properties, binaryBody) {
-  let binaryProperties;
-  for (const name in properties) {
-    if (properties.hasOwnProperty(name)) {
-      const property = properties[name];
-      const byteOffset = property.byteOffset;
-      if (defined(byteOffset)) {
-        // This is a binary property
-        const componentType = property.componentType;
-        const type = property.type;
-        if (!defined(componentType)) {
-          throw new RuntimeError("componentType is required.");
-        }
-        if (!defined(type)) {
-          throw new RuntimeError("type is required.");
-        }
-        if (!defined(binaryBody)) {
-          throw new RuntimeError(
-            `Property ${name} requires a batch table binary.`,
-          );
-        }
-
-        const binaryAccessor = getBinaryAccessor(property);
-        const componentCount = binaryAccessor.componentsPerAttribute;
-        const classType = binaryAccessor.classType;
-        const typedArray = binaryAccessor.createArrayBufferView(
-          binaryBody.buffer,
-          binaryBody.byteOffset + byteOffset,
-          featuresLength,
-        );
-
-        if (!defined(binaryProperties)) {
-          binaryProperties = {};
-        }
-
-        // Store any information needed to access the binary data, including the typed array,
-        // componentCount (e.g. a VEC4 would be 4), and the type used to pack and unpack (e.g. Cartesian4).
-        binaryProperties[name] = {
-          typedArray: typedArray,
-          componentCount: componentCount,
-          type: classType,
-        };
-      }
-    }
-  }
-  return binaryProperties;
-}
-
 function countBinaryPropertyMemory(binaryProperties) {
   let byteLength = 0;
   for (const name in binaryProperties) {

package/Source/Scene/Billboard.js

@@ -227,6 +227,9 @@ function Billboard(options, billboardCollection) {
   this._updateClamping();
 
   this._splitDirection = options.splitDirection ?? SplitDirection.NONE;
+  // Primarily used by labels to indicate that the position is derived from the parent.
+  // and expensive operations like clamping can be skipped.
+  this._positionFromParent = false;
 }
 
 const SHOW_INDEX = (Billboard.SHOW_INDEX = 0);
@@ -1147,6 +1150,7 @@ Billboard._updateClamping = function (collection, owner) {
 
   if (
     owner._heightReference === HeightReference.NONE ||
+    owner._positionFromParent ||
     !defined(owner._position)
   ) {
     return;

package/Source/Scene/BillboardCollection.js

@@ -1020,13 +1020,20 @@ function writeCompressedAttrib0(
     Math.floor(
       CesiumMath.clamp(pixelOffsetY, -UPPER_BOUND, UPPER_BOUND) + UPPER_BOUND,
     ) * LEFT_SHIFT8;
+
+  // We scale `translate` by LEFT_SHIFT2 before encoding it (and unscale after decoding in the shader)
+  // to preserve some subpixel precision (1 / 4 = 0.25 pixels). This mitigates rounding errors in aligning glyphs.
+  // The cost of increasing this scaling factor is that it decreases the range of representable `translate` values
+  // by the same scaling factor. Value must be kept in sync with the shader.
   let compressed2 =
     Math.floor(
-      CesiumMath.clamp(translateX, -UPPER_BOUND, UPPER_BOUND) + UPPER_BOUND,
+      CesiumMath.clamp(translateX * LEFT_SHIFT2, -UPPER_BOUND, UPPER_BOUND) +
+        UPPER_BOUND,
     ) * LEFT_SHIFT8;
 
   const tempTanslateY =
-    (CesiumMath.clamp(translateY, -UPPER_BOUND, UPPER_BOUND) + UPPER_BOUND) *
+    (CesiumMath.clamp(translateY * LEFT_SHIFT2, -UPPER_BOUND, UPPER_BOUND) +
+      UPPER_BOUND) *
     RIGHT_SHIFT8;
   const upperTranslateY = Math.floor(tempTanslateY);
   const lowerTranslateY = Math.floor(