maplibre-gl-lidar 0.6.1 → 0.7.0

package/dist/{LidarLayerAdapter-BW2Hj7QW.cjs → LidarLayerAdapter-eh59KEMT.cjs}

@@ -34221,6 +34221,7 @@ class PointCloudLoader {
     };
   }
 }
+proj4.defs("EPSG:2180", "+proj=tmerc +lat_0=0 +lon_0=19 +k=0.9993 +x_0=500000 +y_0=-5300000 +ellps=GRS80 +towgs84=0,0,0,0,0,0,0 +units=m +no_defs +type=crs");
 function createBufferGetter(buffer) {
   const uint8 = new Uint8Array(buffer);
   return async (begin, end) => {
@@ -34332,12 +34333,40 @@ function getVerticalUnitConversionFactor$1(wkt2) {
   }
   return 1;
 }
+function clampLatLng$1(lng, lat, context = "") {
+  let clampedLng = lng;
+  let clampedLat = lat;
+  let wasClamped = false;
+  if (lat > 90) {
+    clampedLat = 90;
+    wasClamped = true;
+  } else if (lat < -90) {
+    clampedLat = -90;
+    wasClamped = true;
+  }
+  if (lng > 180) {
+    clampedLng = 180;
+    wasClamped = true;
+  } else if (lng < -180) {
+    clampedLng = -180;
+    wasClamped = true;
+  }
+  if (wasClamped) {
+    console.warn(
+      `COPC: Clamped transformed coordinates to valid WGS84 range${context ? ` (${context})` : ""}:`,
+      `[${lng.toFixed(6)}, ${lat.toFixed(6)}] -> [${clampedLng.toFixed(6)}, ${clampedLat.toFixed(6)}]`
+    );
+  }
+  return [clampedLng, clampedLat];
+}
 const DEFAULT_OPTIONS$2 = {
   pointBudget: 5e6,
-  maxConcurrentRequests: 4,
-  viewportDebounceMs: 150,
+  maxConcurrentRequests: 8,
+  viewportDebounceMs: 100,
   minDetailZoom: 10,
-  maxOctreeDepth: 20
+  maxOctreeDepth: 20,
+  maxSubtreesPerViewport: 60
+  // Not used by COPC, but required by interface
 };
 class CopcStreamingLoader {
   /**
@@ -34439,10 +34468,30 @@ class CopcStreamingLoader {
       } catch (e) {
         console.warn("Failed to setup coordinate transformation:", e);
       }
+    } else {
+      const minX = header2.min[0];
+      const minY = header2.min[1];
+      const maxX = header2.max[0];
+      const maxY = header2.max[1];
+      let detectedEPSG = null;
+      if (minX >= 1e5 && maxX <= 9e5 && minY >= 1e5 && maxY <= 8e5) {
+        detectedEPSG = "EPSG:2180";
+      }
+      if (detectedEPSG) {
+        try {
+          const projConverter = proj4(detectedEPSG, "EPSG:4326");
+          this._transformer = (coord) => projConverter.forward(coord);
+          this._needsTransform = true;
+        } catch (e) {
+          console.warn(`Failed to setup coordinate transformation from ${detectedEPSG}:`, e);
+        }
+      }
     }
     if (this._needsTransform && this._transformer) {
-      const [minLng, minLat] = this._transformer([header2.min[0], header2.min[1]]);
-      const [maxLng, maxLat] = this._transformer([header2.max[0], header2.max[1]]);
+      const [rawMinLng, rawMinLat] = this._transformer([header2.min[0], header2.min[1]]);
+      const [rawMaxLng, rawMaxLat] = this._transformer([header2.max[0], header2.max[1]]);
+      const [minLng, minLat] = clampLatLng$1(rawMinLng, rawMinLat, "header bounds min");
+      const [maxLng, maxLat] = clampLatLng$1(rawMaxLng, rawMaxLat, "header bounds max");
       this._bounds = {
         minX: Math.min(minLng, maxLng),
         minY: Math.min(minLat, maxLat),
@@ -34532,8 +34581,10 @@ class CopcStreamingLoader {
     };
     let boundsWgs84 = bounds2;
     if (this._needsTransform && this._transformer) {
-      const [sw_lng, sw_lat] = this._transformer([minX, minY]);
-      const [ne_lng, ne_lat] = this._transformer([minX + nodeSize, minY + nodeSize]);
+      const [rawSwLng, rawSwLat] = this._transformer([minX, minY]);
+      const [rawNeLng, rawNeLat] = this._transformer([minX + nodeSize, minY + nodeSize]);
+      const [sw_lng, sw_lat] = clampLatLng$1(rawSwLng, rawSwLat, "node bounds SW");
+      const [ne_lng, ne_lat] = clampLatLng$1(rawNeLng, rawNeLat, "node bounds NE");
       boundsWgs84 = {
         minX: Math.min(sw_lng, ne_lng),
         minY: Math.min(sw_lat, ne_lat),
@@ -34765,7 +34816,8 @@ class CopcStreamingLoader {
       const y = yGetter(i);
       const z = zGetter(i);
       if (this._needsTransform && this._transformer) {
-        const [lng, lat] = this._transformer([x, y]);
+        const [rawLng, rawLat] = this._transformer([x, y]);
+        const [lng, lat] = clampLatLng$1(rawLng, rawLat, "");
         this._positions[pointIndex * 3] = lng - this._coordinateOrigin[0];
         this._positions[pointIndex * 3 + 1] = lat - this._coordinateOrigin[1];
         this._positions[pointIndex * 3 + 2] = z * this._verticalUnitFactor;
@@ -34986,6 +35038,32 @@ function createAttributeArray(type, length) {
       return new Float32Array(length);
   }
 }
+function clampLatLng(lng, lat, context = "") {
+  let clampedLng = lng;
+  let clampedLat = lat;
+  let wasClamped = false;
+  if (lat > 90) {
+    clampedLat = 90;
+    wasClamped = true;
+  } else if (lat < -90) {
+    clampedLat = -90;
+    wasClamped = true;
+  }
+  if (lng > 180) {
+    clampedLng = 180;
+    wasClamped = true;
+  } else if (lng < -180) {
+    clampedLng = -180;
+    wasClamped = true;
+  }
+  if (wasClamped && context) {
+    console.warn(
+      `EPT: Clamped transformed coordinates to valid WGS84 range${context ? ` (${context})` : ""}:`,
+      `[${lng.toFixed(6)}, ${lat.toFixed(6)}] -> [${clampedLng.toFixed(6)}, ${clampedLat.toFixed(6)}]`
+    );
+  }
+  return [clampedLng, clampedLat];
+}
 function extractProjcsFromWkt(wkt2) {
   if (wkt2.startsWith("COMPD_CS[")) {
     const projcsStart = wkt2.indexOf("PROJCS[");
@@ -35028,10 +35106,11 @@ function getVerticalUnitConversionFactor(wkt2) {
 }
 const DEFAULT_OPTIONS$1 = {
   pointBudget: 5e6,
-  maxConcurrentRequests: 4,
-  viewportDebounceMs: 150,
+  maxConcurrentRequests: 8,
+  viewportDebounceMs: 100,
   minDetailZoom: 10,
-  maxOctreeDepth: 20
+  maxOctreeDepth: 20,
+  maxSubtreesPerViewport: 60
 };
 class EptStreamingLoader {
   /**
@@ -35046,6 +35125,8 @@ class EptStreamingLoader {
     __publicField(this, "_metadata", null);
     // Hierarchy cache
     __publicField(this, "_hierarchyCache", /* @__PURE__ */ new Map());
+    __publicField(this, "_hierarchyLoading", /* @__PURE__ */ new Set());
+    __publicField(this, "_hierarchyFailures", /* @__PURE__ */ new Map());
     __publicField(this, "_subtreeRoots", /* @__PURE__ */ new Set());
     __publicField(this, "_rootHierarchyLoaded", false);
     // Node cache
@@ -35083,6 +35164,7 @@ class EptStreamingLoader {
     __publicField(this, "_pendingLayerUpdate", false);
     __publicField(this, "_updateBatchTimeout", null);
     __publicField(this, "_onPointsLoaded");
+    __publicField(this, "_isResetting", false);
     this._baseUrl = eptUrl.endsWith("/ept.json") ? eptUrl.slice(0, -9) : eptUrl.replace(/\/$/, "");
     this._options = { ...DEFAULT_OPTIONS$1, ...options };
   }
@@ -35125,17 +35207,19 @@ class EptStreamingLoader {
     }
     const [minX, minY, minZ, maxX, maxY, maxZ] = this._metadata.boundsConforming;
     if (this._needsTransform && this._transformer) {
-      const [minLng, minLat] = this._transformer([minX, minY]);
-      const [maxLng, maxLat] = this._transformer([maxX, maxY]);
-      if (isNaN(minLng) || isNaN(minLat) || isNaN(maxLng) || isNaN(maxLat) || !isFinite(minLng) || !isFinite(minLat) || !isFinite(maxLng) || !isFinite(maxLat)) {
+      const [rawMinLng, rawMinLat] = this._transformer([minX, minY]);
+      const [rawMaxLng, rawMaxLat] = this._transformer([maxX, maxY]);
+      if (isNaN(rawMinLng) || isNaN(rawMinLat) || isNaN(rawMaxLng) || isNaN(rawMaxLat) || !isFinite(rawMinLng) || !isFinite(rawMinLat) || !isFinite(rawMaxLng) || !isFinite(rawMaxLat)) {
         console.error("EPT coordinate transformation produced invalid bounds:", {
           input: { minX, minY, maxX, maxY },
-          output: { minLng, minLat, maxLng, maxLat }
+          output: { rawMinLng, rawMinLat, rawMaxLng, rawMaxLat }
         });
         this._bounds = { minX, minY, minZ, maxX, maxY, maxZ };
         this._needsTransform = false;
         this._transformer = null;
       } else {
+        const [minLng, minLat] = clampLatLng(rawMinLng, rawMinLat, "header bounds min");
+        const [maxLng, maxLat] = clampLatLng(rawMaxLng, rawMaxLat, "header bounds max");
         this._bounds = {
           minX: Math.min(minLng, maxLng),
           minY: Math.min(minLat, maxLat),
@@ -35286,8 +35370,10 @@ class EptStreamingLoader {
     };
     let boundsWgs84 = bounds2;
     if (this._needsTransform && this._transformer) {
-      const [sw_lng, sw_lat] = this._transformer([minX, minY]);
-      const [ne_lng, ne_lat] = this._transformer([minX + nodeSize, minY + nodeSize]);
+      const [rawSwLng, rawSwLat] = this._transformer([minX, minY]);
+      const [rawNeLng, rawNeLat] = this._transformer([minX + nodeSize, minY + nodeSize]);
+      const [sw_lng, sw_lat] = clampLatLng(rawSwLng, rawSwLat, "node bounds SW");
+      const [ne_lng, ne_lat] = clampLatLng(rawNeLng, rawNeLat, "node bounds NE");
       boundsWgs84 = {
         minX: Math.min(sw_lng, ne_lng),
         minY: Math.min(sw_lat, ne_lat),
@@ -35338,22 +35424,26 @@ class EptStreamingLoader {
    * @param key - Hierarchy key (e.g., "0-0-0-0")
    */
   async _loadHierarchy(key) {
-    if (this._hierarchyCache.has(key)) return;
+    if (this._hierarchyCache.has(key) || this._hierarchyLoading.has(key)) return;
     const url = `${this._baseUrl}/ept-hierarchy/${key}.json`;
+    this._hierarchyLoading.add(key);
     try {
       const response = await fetch(url);
       if (!response.ok) {
+        this._hierarchyFailures.set(key, Date.now());
         console.warn(`Failed to load hierarchy ${key}: ${response.status}`);
         return;
       }
       const hierarchy2 = await response.json();
       this._hierarchyCache.set(key, hierarchy2);
+      this._hierarchyFailures.delete(key);
       for (const [nodeKey, value] of Object.entries(hierarchy2)) {
         const keyArray = this._parseNodeKey(nodeKey);
         const { bounds: bounds2, boundsWgs84 } = this._calculateNodeBounds(keyArray);
+        const existingNode = this._nodeCache.get(nodeKey);
         if (value === -1) {
           this._subtreeRoots.add(nodeKey);
-          if (!this._nodeCache.has(nodeKey)) {
+          if (!existingNode) {
             this._nodeCache.set(nodeKey, {
               key: nodeKey,
               keyArray,
@@ -35364,19 +35454,29 @@ class EptStreamingLoader {
               boundsWgs84
             });
           }
-        } else if (value > 0 && !this._nodeCache.has(nodeKey)) {
-          this._nodeCache.set(nodeKey, {
-            key: nodeKey,
-            keyArray,
-            state: "pending",
-            pointCount: value,
-            bounds: bounds2,
-            boundsWgs84
-          });
+        } else if (value > 0) {
+          if ((existingNode == null ? void 0 : existingNode.state) === "subtree") {
+            existingNode.state = "pending";
+            existingNode.pointCount = value;
+            existingNode.bounds = bounds2;
+            existingNode.boundsWgs84 = boundsWgs84;
+          } else if (!existingNode) {
+            this._nodeCache.set(nodeKey, {
+              key: nodeKey,
+              keyArray,
+              state: "pending",
+              pointCount: value,
+              bounds: bounds2,
+              boundsWgs84
+            });
+          }
         }
       }
     } catch (error) {
+      this._hierarchyFailures.set(key, Date.now());
       console.warn(`Error loading hierarchy ${key}:`, error);
+    } finally {
+      this._hierarchyLoading.delete(key);
     }
   }
   /**
@@ -35401,22 +35501,31 @@ class EptStreamingLoader {
     }
     await this._ensureHierarchyLoaded();
     const targetDepth = viewport.targetDepth;
-    const subtreesToLoad = [];
-    for (const [, node] of this._nodeCache) {
-      const depth = node.keyArray[0];
-      if (depth > targetDepth + 2) continue;
-      if (node.state === "subtree" && this._boundsIntersectsViewport(node.boundsWgs84, viewport)) {
-        if (!this._hierarchyCache.has(node.key)) {
-          subtreesToLoad.push(node.key);
-        }
-      }
-    }
-    const maxSubtreesToLoad = 10;
-    for (const subtreeKey of subtreesToLoad.slice(0, maxSubtreesToLoad)) {
-      await this._loadHierarchy(subtreeKey);
+    const maxSubtreesToLoad = Math.max(1, this._options.maxSubtreesPerViewport);
+    const loadedSubtrees = /* @__PURE__ */ new Set();
+    const maxPasses = 3;
+    const now = Date.now();
+    const hierarchyRetryCooldownMs = 5e3;
+    for (let pass = 0; pass < maxPasses; pass++) {
+      const subtreeCandidates = [];
+      for (const [, node] of this._nodeCache) {
+        const depth = node.keyArray[0];
+        if (depth > targetDepth + 3) continue;
+        const lastFailure = this._hierarchyFailures.get(node.key);
+        if (node.state === "subtree" && !this._hierarchyCache.has(node.key) && !this._hierarchyLoading.has(node.key) && !loadedSubtrees.has(node.key) && (!lastFailure || now - lastFailure >= hierarchyRetryCooldownMs) && this._boundsIntersectsViewport(node.boundsWgs84, viewport)) {
+          const priority = this._calculateNodePriority(node.boundsWgs84, viewport);
+          subtreeCandidates.push({ key: node.key, priority });
+        }
+      }
+      if (subtreeCandidates.length === 0) break;
+      subtreeCandidates.sort((a, b) => a.priority - b.priority);
+      const perPassLimit = Math.ceil(maxSubtreesToLoad / maxPasses);
+      const subtreesToProcess = subtreeCandidates.slice(0, perPassLimit).map((s) => s.key);
+      await Promise.all(subtreesToProcess.map((subtreeKey) => this._loadHierarchy(subtreeKey)));
+      subtreesToProcess.forEach((key) => loadedSubtrees.add(key));
+      if (loadedSubtrees.size >= maxSubtreesToLoad) break;
     }
     const nodesToLoad = [];
-    const now = Date.now();
     const retryCooldownMs = 5e3;
     for (const [, node] of this._nodeCache) {
       const depth = node.keyArray[0];
@@ -35425,7 +35534,7 @@ class EptStreamingLoader {
       if (node.lastFailedAt && now - node.lastFailedAt < retryCooldownMs) {
         continue;
       }
-      if (depth > targetDepth + 1) continue;
+      if (depth > targetDepth + 2) continue;
       if (!this._boundsIntersectsViewport(node.boundsWgs84, viewport)) {
         continue;
       }
@@ -35571,7 +35680,8 @@ class EptStreamingLoader {
       const y = positions[i * 3 + 1];
       const z = positions[i * 3 + 2];
       if (this._needsTransform && this._transformer) {
-        const [lng, lat] = this._transformer([x, y]);
+        const [rawLng, rawLat] = this._transformer([x, y]);
+        const [lng, lat] = clampLatLng(rawLng, rawLat, "");
         this._positions[pointIndex * 3] = lng - this._coordinateOrigin[0];
         this._positions[pointIndex * 3 + 1] = lat - this._coordinateOrigin[1];
         this._positions[pointIndex * 3 + 2] = z * this._verticalUnitFactor;
@@ -35651,7 +35761,8 @@ class EptStreamingLoader {
       const y = yGetter(dataView, byteOffset);
       const z = zGetter(dataView, byteOffset);
       if (this._needsTransform && this._transformer) {
-        const [lng, lat] = this._transformer([x, y]);
+        const [rawLng, rawLat] = this._transformer([x, y]);
+        const [lng, lat] = clampLatLng(rawLng, rawLat, "");
         this._positions[pointIndex * 3] = lng - this._coordinateOrigin[0];
         this._positions[pointIndex * 3 + 1] = lat - this._coordinateOrigin[1];
         this._positions[pointIndex * 3 + 2] = z * this._verticalUnitFactor;
@@ -35744,6 +35855,27 @@ class EptStreamingLoader {
       wkt: (_c = (_b = this._metadata) == null ? void 0 : _b.srs) == null ? void 0 : _c.wkt
     };
   }
+  /**
+   * Checks whether there are subtree hierarchies still pending for the viewport.
+   *
+   * @param viewport - Current viewport information
+   * @returns True if more subtree hierarchies should be loaded
+   */
+  hasPendingSubtrees(viewport) {
+    if (!this._isInitialized) return false;
+    const targetDepth = viewport.targetDepth;
+    const now = Date.now();
+    const hierarchyRetryCooldownMs = 5e3;
+    for (const [, node] of this._nodeCache) {
+      const depth = node.keyArray[0];
+      if (depth > targetDepth + 3) continue;
+      const lastFailure = this._hierarchyFailures.get(node.key);
+      if (node.state === "subtree" && !this._hierarchyCache.has(node.key) && !this._hierarchyLoading.has(node.key) && (!lastFailure || now - lastFailure >= hierarchyRetryCooldownMs) && this._boundsIntersectsViewport(node.boundsWgs84, viewport)) {
+        return true;
+      }
+    }
+    return false;
+  }
   /**
    * Gets the current streaming progress.
    */
@@ -35799,6 +35931,60 @@ class EptStreamingLoader {
   getLoadedPointCount() {
     return this._totalLoadedPoints;
   }
+  /**
+   * Gets the current point budget.
+   */
+  getPointBudget() {
+    return this._options.pointBudget;
+  }
+  /**
+   * Checks if any nodes intersecting the viewport have already been loaded.
+   *
+   * @param viewport - Current viewport information
+   * @returns True if viewport has loaded coverage
+   */
+  hasLoadedNodesInViewport(viewport, minDepth = 0) {
+    for (const [, node] of this._nodeCache) {
+      if (node.state !== "loaded") continue;
+      if (node.keyArray[0] < minDepth) continue;
+      if (this._boundsIntersectsViewport(node.boundsWgs84, viewport)) {
+        return true;
+      }
+    }
+    return false;
+  }
+  /**
+   * Estimates viewport coverage ratio by loaded nodes.
+   * Returns a value from 0 to 1 representing how much of the viewport
+   * is covered by loaded tiles.
+   *
+   * @param viewport - Current viewport information
+   * @param minDepth - Minimum octree depth to consider
+   * @returns Coverage ratio (0-1)
+   */
+  getViewportCoverageRatio(viewport, minDepth = 0) {
+    const [west, south, east, north] = viewport.bounds;
+    const viewportArea = (east - west) * (north - south);
+    if (viewportArea <= 0) return 0;
+    let coveredArea = 0;
+    for (const [, node] of this._nodeCache) {
+      if (node.state !== "loaded") continue;
+      if (node.keyArray[0] < minDepth) continue;
+      const nodeWest = node.boundsWgs84.minX;
+      const nodeSouth = node.boundsWgs84.minY;
+      const nodeEast = node.boundsWgs84.maxX;
+      const nodeNorth = node.boundsWgs84.maxY;
+      const intersectWest = Math.max(west, nodeWest);
+      const intersectEast = Math.min(east, nodeEast);
+      const intersectSouth = Math.max(south, nodeSouth);
+      const intersectNorth = Math.min(north, nodeNorth);
+      if (intersectWest < intersectEast && intersectSouth < intersectNorth) {
+        const intersectArea = (intersectEast - intersectWest) * (intersectNorth - intersectSouth);
+        coveredArea += intersectArea;
+      }
+    }
+    return Math.min(1, coveredArea / viewportArea);
+  }
   /**
    * Gets the total number of loaded nodes.
    */
@@ -35811,6 +35997,48 @@ class EptStreamingLoader {
   isLoading() {
     return this._activeRequests > 0 || this._loadingQueue.length > 0;
   }
+  /**
+   * Removes queued nodes that are outside the current viewport and re-sorts priorities.
+   *
+   * @param viewport - Current viewport information
+   */
+  pruneQueueForViewport(viewport) {
+    if (this._loadingQueue.length === 0) return;
+    this._loadingQueue = this._loadingQueue.filter(
+      (node) => this._boundsIntersectsViewport(node.boundsWgs84, viewport)
+    );
+    for (const node of this._loadingQueue) {
+      const distPriority = this._calculateNodePriority(node.boundsWgs84, viewport);
+      const depth = node.keyArray[0];
+      node.priority = distPriority - depth * 1e-4;
+    }
+    this._loadingQueue.sort((a, b) => (a.priority || Infinity) - (b.priority || Infinity));
+  }
+  /**
+   * Resets loaded node data to allow loading a new area.
+   * Keeps hierarchy cache intact but clears loaded points and node states.
+   *
+   * @returns True if reset occurred
+   */
+  resetLoadedData() {
+    if (this._activeRequests > 0 || this._isResetting) return false;
+    this._isResetting = true;
+    this._loadingQueue = [];
+    this._totalLoadedPoints = 0;
+    this._totalLoadedNodes = 0;
+    for (const [, node] of this._nodeCache) {
+      if (node.state === "loaded" || node.state === "loading" || node.state === "error") {
+        node.state = "pending";
+        node.bufferStartIndex = void 0;
+        node.error = void 0;
+        node.retryCount = void 0;
+        node.lastFailedAt = void 0;
+      }
+    }
+    this._scheduleLayerUpdate();
+    this._isResetting = false;
+    return true;
+  }
   /**
    * Gets the EPT metadata.
    */
@@ -35827,6 +36055,8 @@ class EptStreamingLoader {
     this._loadingQueue = [];
     this._nodeCache.clear();
     this._hierarchyCache.clear();
+    this._hierarchyLoading.clear();
+    this._hierarchyFailures.clear();
     this._subtreeRoots.clear();
     this._eventHandlers.clear();
     this._positions = null;
@@ -35924,37 +36154,180 @@ function computePercentileBounds(arr, lowerPercentile = 2, upperPercentile = 98)
   }
   return { min, max };
 }
-const ELEVATION_RAMP = [
+const VIRIDIS = [
   [68, 1, 84],
-  // dark purple
   [72, 40, 120],
-  // purple
   [62, 74, 137],
-  // blue-purple
   [49, 104, 142],
-  // blue
   [38, 130, 142],
-  // teal-blue
   [31, 158, 137],
-  // teal
   [53, 183, 121],
-  // green-teal
   [109, 205, 89],
-  // green
   [180, 222, 44],
-  // yellow-green
   [253, 231, 37]
-  // yellow
 ];
-const INTENSITY_RAMP = [
+const PLASMA = [
+  [13, 8, 135],
+  [75, 3, 161],
+  [125, 3, 168],
+  [168, 34, 150],
+  [203, 70, 121],
+  [229, 107, 93],
+  [248, 148, 65],
+  [253, 195, 40],
+  [240, 249, 33],
+  [240, 249, 33]
+];
+const INFERNO = [
+  [0, 0, 4],
+  [40, 11, 84],
+  [89, 13, 115],
+  [137, 31, 107],
+  [179, 55, 79],
+  [213, 87, 49],
+  [240, 130, 24],
+  [253, 184, 43],
+  [249, 251, 146],
+  [252, 255, 164]
+];
+const MAGMA = [
+  [0, 0, 4],
+  [28, 16, 68],
+  [79, 18, 123],
+  [129, 37, 129],
+  [181, 54, 122],
+  [229, 80, 100],
+  [251, 135, 97],
+  [254, 194, 135],
+  [254, 247, 187],
+  [252, 253, 191]
+];
+const CIVIDIS = [
+  [0, 32, 77],
+  [0, 58, 103],
+  [52, 77, 105],
+  [87, 95, 108],
+  [115, 113, 112],
+  [143, 132, 108],
+  [171, 152, 97],
+  [200, 173, 79],
+  [231, 196, 55],
+  [253, 231, 37]
+];
+const TURBO = [
+  [48, 18, 59],
+  [70, 107, 227],
+  [40, 170, 225],
+  [35, 221, 162],
+  [122, 249, 85],
+  [194, 241, 45],
+  [241, 206, 51],
+  [250, 144, 42],
+  [229, 68, 25],
+  [122, 4, 3]
+];
+const JET = [
+  [0, 0, 127],
+  [0, 0, 255],
+  [0, 127, 255],
+  [0, 255, 255],
+  [127, 255, 127],
+  [255, 255, 0],
+  [255, 127, 0],
+  [255, 0, 0],
+  [127, 0, 0],
+  [127, 0, 0]
+];
+const RAINBOW = [
+  [150, 0, 90],
+  [0, 0, 200],
+  [0, 125, 255],
+  [0, 200, 255],
+  [0, 255, 125],
+  [125, 255, 0],
+  [255, 255, 0],
+  [255, 125, 0],
+  [255, 0, 0],
+  [128, 0, 0]
+];
+const TERRAIN = [
+  [51, 51, 153],
+  [51, 102, 153],
+  [51, 153, 153],
+  [102, 178, 102],
+  [153, 204, 102],
+  [204, 229, 102],
+  [204, 204, 153],
+  [178, 153, 102],
+  [153, 102, 51],
+  [255, 255, 255]
+];
+const COOLWARM = [
+  [59, 76, 192],
+  [98, 130, 234],
+  [141, 176, 254],
+  [184, 208, 249],
+  [221, 221, 221],
+  [245, 196, 173],
+  [244, 154, 123],
+  [222, 96, 77],
+  [180, 4, 38],
+  [180, 4, 38]
+];
+const GRAY = [
   [0, 0, 0],
-  // black
-  [64, 64, 64],
-  [128, 128, 128],
-  [192, 192, 192],
+  [28, 28, 28],
+  [57, 57, 57],
+  [85, 85, 85],
+  [113, 113, 113],
+  [142, 142, 142],
+  [170, 170, 170],
+  [198, 198, 198],
+  [227, 227, 227],
   [255, 255, 255]
-  // white
 ];
+const COLORMAPS = {
+  viridis: VIRIDIS,
+  plasma: PLASMA,
+  inferno: INFERNO,
+  magma: MAGMA,
+  cividis: CIVIDIS,
+  turbo: TURBO,
+  jet: JET,
+  rainbow: RAINBOW,
+  terrain: TERRAIN,
+  coolwarm: COOLWARM,
+  gray: GRAY
+};
+const COLORMAP_NAMES = [
+  "viridis",
+  "plasma",
+  "inferno",
+  "magma",
+  "cividis",
+  "turbo",
+  "jet",
+  "rainbow",
+  "terrain",
+  "coolwarm",
+  "gray"
+];
+const COLORMAP_LABELS = {
+  viridis: "Viridis",
+  plasma: "Plasma",
+  inferno: "Inferno",
+  magma: "Magma",
+  cividis: "Cividis",
+  turbo: "Turbo",
+  jet: "Jet",
+  rainbow: "Rainbow",
+  terrain: "Terrain",
+  coolwarm: "Cool-Warm",
+  gray: "Grayscale"
+};
+function getColormap(name) {
+  return COLORMAPS[name] || COLORMAPS.viridis;
+}
 const CLASSIFICATION_COLORS = {
   0: [128, 128, 128],
   // Created, never classified
@@ -35996,6 +36369,10 @@ const CLASSIFICATION_COLORS = {
   // High Noise
 };
 class ColorSchemeProcessor {
+  constructor() {
+    /** Last computed color bounds (for colorbar display) */
+    __publicField(this, "_lastComputedBounds");
+  }
   /**
    * Generates a color array for the point cloud based on the color scheme.
    *
@@ -36005,100 +36382,150 @@ class ColorSchemeProcessor {
    * @returns Uint8Array of RGBA colors (length = pointCount * 4)
    */
   getColors(data, scheme, options = {}) {
+    const result = this.getColorsWithBounds(data, scheme, options);
+    return result.colors;
+  }
+  /**
+   * Generates a color array and returns the computed bounds.
+   *
+   * @param data - Point cloud data
+   * @param scheme - Color scheme to apply
+   * @param options - Optional color generation options
+   * @returns ColorResult containing colors and computed bounds
+   */
+  getColorsWithBounds(data, scheme, options = {}) {
     const colors = new Uint8Array(data.pointCount * 4);
+    const colormap = options.colormap ?? "viridis";
+    const colorRange = options.colorRange;
     const usePercentile = options.usePercentile ?? true;
     if (typeof scheme === "string") {
       switch (scheme) {
         case "elevation":
-          return this._colorByElevation(data, colors, usePercentile);
+          return this._colorByElevation(data, colors, colormap, colorRange, usePercentile);
         case "intensity":
-          return this._colorByIntensity(data, colors, usePercentile);
+          return this._colorByIntensity(data, colors, colormap, colorRange, usePercentile);
         case "classification":
-          return this._colorByClassification(data, colors, options.hiddenClassifications);
+          return { colors: this._colorByClassification(data, colors, options.hiddenClassifications) };
         case "rgb":
-          return this._colorByRGB(data, colors);
+          return { colors: this._colorByRGB(data, colors) };
         default:
-          return this._colorByElevation(data, colors, usePercentile);
+          return this._colorByElevation(data, colors, colormap, colorRange, usePercentile);
+      }
+    } else {
+      return { colors: this._colorByCustom(data, colors, scheme, colormap, colorRange, usePercentile) };
+    }
+  }
+  /**
+   * Gets the last computed color bounds (for colorbar display).
+   *
+   * @returns The last computed bounds or undefined
+   */
+  getLastComputedBounds() {
+    return this._lastComputedBounds;
+  }
+  /**
+   * Computes the color bounds based on the configuration.
+   *
+   * @param values - Array of values to compute bounds for
+   * @param dataBounds - Data bounds (min/max)
+   * @param colorRange - Color range configuration
+   * @param usePercentile - Legacy percentile flag
+   * @returns Computed min and max bounds
+   */
+  _computeBounds(values, dataBounds, colorRange, usePercentile) {
+    if (colorRange) {
+      if (colorRange.mode === "absolute") {
+        return {
+          min: colorRange.absoluteMin ?? dataBounds.min,
+          max: colorRange.absoluteMax ?? dataBounds.max
+        };
+      } else {
+        const pLow = colorRange.percentileLow ?? 2;
+        const pHigh = colorRange.percentileHigh ?? 98;
+        return computePercentileBounds(values, pLow, pHigh);
       }
+    } else if (usePercentile) {
+      return computePercentileBounds(values, 2, 98);
     } else {
-      return this._colorByCustom(data, colors, scheme);
+      return dataBounds;
     }
   }
   /**
-   * Colors points by elevation using terrain-like ramp.
+   * Colors points by elevation using the specified colormap.
    *
    * @param data - Point cloud data
    * @param colors - Output color array
-   * @param usePercentile - Whether to use percentile bounds (2-98%) for better color distribution
+   * @param colormap - Colormap name to use
+   * @param colorRange - Color range configuration
+   * @param usePercentile - Legacy percentile flag
+   * @returns ColorResult with colors and computed bounds
    */
-  _colorByElevation(data, colors, usePercentile) {
+  _colorByElevation(data, colors, colormap, colorRange, usePercentile) {
     var _a, _b;
     if (!data.positions || data.positions.length === 0) {
-      return colors;
-    }
-    let minZ;
-    let maxZ;
-    if (usePercentile) {
-      const zValues = new Float32Array(data.pointCount);
-      for (let i = 0; i < data.pointCount; i++) {
-        zValues[i] = data.positions[i * 3 + 2] ?? 0;
-      }
-      const bounds2 = computePercentileBounds(zValues, 2, 98);
-      minZ = bounds2.min;
-      maxZ = bounds2.max;
-    } else {
-      minZ = ((_a = data.bounds) == null ? void 0 : _a.minZ) ?? 0;
-      maxZ = ((_b = data.bounds) == null ? void 0 : _b.maxZ) ?? 1;
+      return { colors };
     }
+    const zValues = new Float32Array(data.pointCount);
+    for (let i = 0; i < data.pointCount; i++) {
+      zValues[i] = data.positions[i * 3 + 2] ?? 0;
+    }
+    const dataBounds = {
+      min: ((_a = data.bounds) == null ? void 0 : _a.minZ) ?? 0,
+      max: ((_b = data.bounds) == null ? void 0 : _b.maxZ) ?? 1
+    };
+    const bounds2 = this._computeBounds(zValues, dataBounds, colorRange, usePercentile);
+    this._lastComputedBounds = bounds2;
+    const { min: minZ, max: maxZ } = bounds2;
     const range = maxZ - minZ || 1;
+    const ramp = COLORMAPS[colormap] || COLORMAPS.viridis;
     for (let i = 0; i < data.pointCount; i++) {
-      const z = data.positions[i * 3 + 2] ?? 0;
+      const z = zValues[i];
       const t = (z - minZ) / range;
-      const color = this._interpolateRamp(ELEVATION_RAMP, t);
+      const color = this._interpolateRamp(ramp, t);
       colors[i * 4] = color[0];
       colors[i * 4 + 1] = color[1];
       colors[i * 4 + 2] = color[2];
       colors[i * 4 + 3] = 255;
     }
-    return colors;
+    return { colors, bounds: bounds2 };
   }
   /**
-   * Colors points by intensity using grayscale ramp.
+   * Colors points by intensity using the specified colormap.
    *
    * @param data - Point cloud data
    * @param colors - Output color array
-   * @param usePercentile - Whether to use percentile bounds (2-98%) for better color distribution
+   * @param colormap - Colormap name to use
+   * @param colorRange - Color range configuration
+   * @param usePercentile - Legacy percentile flag
+   * @returns ColorResult with colors and computed bounds
    */
-  _colorByIntensity(data, colors, usePercentile) {
+  _colorByIntensity(data, colors, colormap, colorRange, usePercentile) {
     if (!data.hasIntensity || !data.intensities) {
-      return this._colorByElevation(data, colors, usePercentile);
-    }
-    let minI;
-    let maxI;
-    if (usePercentile) {
-      const bounds2 = computePercentileBounds(data.intensities, 2, 98);
-      minI = bounds2.min;
-      maxI = bounds2.max;
-    } else {
-      minI = Infinity;
-      maxI = -Infinity;
-      for (let i = 0; i < data.pointCount; i++) {
-        const intensity = data.intensities[i];
-        if (intensity < minI) minI = intensity;
-        if (intensity > maxI) maxI = intensity;
-      }
+      return this._colorByElevation(data, colors, colormap, colorRange, usePercentile);
     }
-    const range = maxI - minI || 1;
+    let minI = Infinity;
+    let maxI = -Infinity;
     for (let i = 0; i < data.pointCount; i++) {
       const intensity = data.intensities[i];
-      const t = (intensity - minI) / range;
-      const color = this._interpolateRamp(INTENSITY_RAMP, t);
+      if (intensity < minI) minI = intensity;
+      if (intensity > maxI) maxI = intensity;
+    }
+    const dataBounds = { min: minI, max: maxI };
+    const bounds2 = this._computeBounds(data.intensities, dataBounds, colorRange, usePercentile);
+    this._lastComputedBounds = bounds2;
+    const { min: minVal, max: maxVal } = bounds2;
+    const range = maxVal - minVal || 1;
+    const ramp = COLORMAPS[colormap] || COLORMAPS.gray;
+    for (let i = 0; i < data.pointCount; i++) {
+      const intensity = data.intensities[i];
+      const t = (intensity - minVal) / range;
+      const color = this._interpolateRamp(ramp, t);
       colors[i * 4] = color[0];
       colors[i * 4 + 1] = color[1];
       colors[i * 4 + 2] = color[2];
       colors[i * 4 + 3] = 255;
     }
-    return colors;
+    return { colors, bounds: bounds2 };
   }
   /**
    * Colors points by classification using ASPRS standard colors.
@@ -36106,10 +36533,12 @@ class ColorSchemeProcessor {
    * @param data - Point cloud data
    * @param colors - Output color array
    * @param hiddenClassifications - Optional set of classification codes to hide (alpha=0)
+   * @returns Color array
    */
   _colorByClassification(data, colors, hiddenClassifications) {
     if (!data.hasClassification || !data.classifications) {
-      return this._colorByElevation(data, colors, true);
+      const result = this._colorByElevation(data, colors, "viridis", void 0, true);
+      return result.colors;
     }
     for (let i = 0; i < data.pointCount; i++) {
       const cls = data.classifications[i];
@@ -36123,10 +36552,15 @@ class ColorSchemeProcessor {
   }
   /**
    * Uses embedded RGB colors from the point cloud.
+   *
+   * @param data - Point cloud data
+   * @param colors - Output color array
+   * @returns Color array
    */
   _colorByRGB(data, colors) {
     if (!data.hasRGB || !data.colors) {
-      return this._colorByElevation(data, colors, true);
+      const result = this._colorByElevation(data, colors, "viridis", void 0, true);
+      return result.colors;
     }
     for (let i = 0; i < data.pointCount; i++) {
       colors[i * 4] = data.colors[i * 4];
@@ -36138,12 +36572,25 @@ class ColorSchemeProcessor {
   }
   /**
    * Applies a custom color scheme configuration.
+   *
+   * @param data - Point cloud data
+   * @param colors - Output color array
+   * @param _config - Custom color scheme config
+   * @param colormap - Colormap name to use
+   * @param colorRange - Color range configuration
+   * @param usePercentile - Legacy percentile flag
+   * @returns Color array
    */
-  _colorByCustom(data, colors, _config) {
-    return this._colorByElevation(data, colors, true);
+  _colorByCustom(data, colors, _config, colormap, colorRange, usePercentile) {
+    const result = this._colorByElevation(data, colors, colormap, colorRange, usePercentile);
+    return result.colors;
   }
   /**
    * Interpolates a color from a color ramp.
+   *
+   * @param ramp - Color ramp array
+   * @param t - Interpolation parameter (0-1)
+   * @returns Interpolated RGB color
    */
   _interpolateRamp(ramp, t) {
     if (!Number.isFinite(t)) {
@@ -36201,6 +36648,7 @@ class PointCloudManager {
     __publicField(this, "_pointClouds");
     __publicField(this, "_options");
     __publicField(this, "_colorProcessor");
+    __publicField(this, "_lastComputedBounds");
     this._deckOverlay = deckOverlay;
     this._pointClouds = /* @__PURE__ */ new Map();
     this._colorProcessor = new ColorSchemeProcessor();
@@ -36209,6 +36657,8 @@ class PointCloudManager {
       opacity: options.opacity ?? 1,
       colorScheme: options.colorScheme ?? "elevation",
       usePercentile: options.usePercentile ?? true,
+      colormap: options.colormap ?? "viridis",
+      colorRange: options.colorRange,
       elevationRange: options.elevationRange ?? null,
       pickable: options.pickable ?? false,
       zOffset: options.zOffset ?? 0,
@@ -36230,15 +36680,20 @@ class PointCloudManager {
    * @param data - Point cloud data (positions are already offsets from coordinateOrigin)
    */
   addPointCloud(id, data) {
-    const colors = this._colorProcessor.getColors(data, this._options.colorScheme, {
+    const result = this._colorProcessor.getColorsWithBounds(data, this._options.colorScheme, {
       usePercentile: this._options.usePercentile,
+      colormap: this._options.colormap,
+      colorRange: this._options.colorRange,
       hiddenClassifications: this._options.hiddenClassifications
     });
+    if (result.bounds) {
+      this._lastComputedBounds = result.bounds;
+    }
     const coordinateOrigin = data.coordinateOrigin;
     this._pointClouds.set(id, {
       id,
       data,
-      colors,
+      colors: result.colors,
       coordinateOrigin,
       visible: true,
       opacityOverride: null
@@ -36258,14 +36713,19 @@ class PointCloudManager {
     }
     const existing = this._pointClouds.get(id);
     if (existing) {
-      const colors = this._colorProcessor.getColors(data, this._options.colorScheme, {
+      const result = this._colorProcessor.getColorsWithBounds(data, this._options.colorScheme, {
         usePercentile: this._options.usePercentile,
+        colormap: this._options.colormap,
+        colorRange: this._options.colorRange,
         hiddenClassifications: this._options.hiddenClassifications
       });
+      if (result.bounds) {
+        this._lastComputedBounds = result.bounds;
+      }
       this._pointClouds.set(id, {
         id,
         data,
-        colors,
+        colors: result.colors,
         coordinateOrigin: data.coordinateOrigin,
         visible: existing.visible,
         opacityOverride: existing.opacityOverride
@@ -36336,17 +36796,24 @@ class PointCloudManager {
   updateStyle(options) {
     const colorSchemeChanged = options.colorScheme !== void 0 && options.colorScheme !== this._options.colorScheme;
     const percentileChanged = options.usePercentile !== void 0 && options.usePercentile !== this._options.usePercentile;
+    const colormapChanged = options.colormap !== void 0 && options.colormap !== this._options.colormap;
+    const colorRangeChanged = options.colorRange !== void 0;
     const hiddenClassificationsChanged = options.hiddenClassifications !== void 0;
     this._options = { ...this._options, ...options };
-    if (colorSchemeChanged || percentileChanged || hiddenClassificationsChanged) {
+    if (colorSchemeChanged || percentileChanged || colormapChanged || colorRangeChanged || hiddenClassificationsChanged) {
       for (const [id, pc] of this._pointClouds) {
-        const colors = this._colorProcessor.getColors(pc.data, this._options.colorScheme, {
+        const result = this._colorProcessor.getColorsWithBounds(pc.data, this._options.colorScheme, {
           usePercentile: this._options.usePercentile,
+          colormap: this._options.colormap,
+          colorRange: this._options.colorRange,
           hiddenClassifications: this._options.hiddenClassifications
         });
+        if (result.bounds) {
+          this._lastComputedBounds = result.bounds;
+        }
         this._pointClouds.set(id, {
           ...pc,
-          colors,
+          colors: result.colors,
           coordinateOrigin: pc.coordinateOrigin,
           visible: pc.visible,
           opacityOverride: pc.opacityOverride
@@ -36393,6 +36860,22 @@ class PointCloudManager {
   setUsePercentile(usePercentile) {
     this.updateStyle({ usePercentile });
   }
+  /**
+   * Sets the colormap for elevation/intensity coloring.
+   *
+   * @param colormap - Colormap name
+   */
+  setColormap(colormap) {
+    this.updateStyle({ colormap });
+  }
+  /**
+   * Sets the color range configuration.
+   *
+   * @param colorRange - Color range configuration
+   */
+  setColorRange(colorRange) {
+    this.updateStyle({ colorRange });
+  }
   /**
    * Sets the elevation range filter.
    *
@@ -36491,6 +36974,13 @@ class PointCloudManager {
   getOptions() {
     return { ...this._options };
   }
+  /**
+   * Gets the last computed color bounds.
+   * Used for displaying accurate colorbar min/max values.
+   */
+  getLastComputedBounds() {
+    return this._lastComputedBounds;
+  }
   /**
    * Creates a deck.gl layer for a point cloud.
    * Chunks large point clouds into multiple layers to avoid WebGL buffer limits.
@@ -36979,6 +37469,7 @@ class DualRangeSlider {
     __publicField(this, "_sliderLow");
     __publicField(this, "_sliderHigh");
     __publicField(this, "_valueDisplay");
+    __publicField(this, "_rangeHighlight");
     this._options = options;
   }
   /**
@@ -37026,6 +37517,7 @@ class DualRangeSlider {
       background: #159895;
       border-radius: 2px;
     `;
+    this._rangeHighlight = range;
     sliderContainer.appendChild(range);
     const sliderLow = document.createElement("input");
     sliderLow.type = "range";
@@ -37143,6 +37635,7 @@ class DualRangeSlider {
     if (this._valueDisplay) {
       this._valueDisplay.textContent = this._formatRange(low, high);
     }
+    this._updateRangeHighlight();
   }
   /**
    * Updates the min/max bounds of the slider.
@@ -37158,6 +37651,33 @@ class DualRangeSlider {
       this._sliderHigh.min = String(min);
       this._sliderHigh.max = String(max);
     }
+    this._updateRangeHighlight();
+  }
+  /**
+   * Updates the step value of the slider.
+   */
+  setStep(step2) {
+    this._options.step = step2;
+    if (this._sliderLow) {
+      this._sliderLow.step = String(step2);
+    }
+    if (this._sliderHigh) {
+      this._sliderHigh.step = String(step2);
+    }
+  }
+  /**
+   * Updates the visual range highlight bar.
+   */
+  _updateRangeHighlight() {
+    if (!this._rangeHighlight || !this._sliderLow || !this._sliderHigh) return;
+    const low = parseFloat(this._sliderLow.value);
+    const high = parseFloat(this._sliderHigh.value);
+    const min = this._options.min;
+    const max = this._options.max;
+    const percentLow = (low - min) / (max - min) * 100;
+    const percentHigh = (high - min) / (max - min) * 100;
+    this._rangeHighlight.style.left = `${percentLow}%`;
+    this._rangeHighlight.style.width = `${percentHigh - percentLow}%`;
   }
   /**
    * Gets the current range values.
@@ -37310,6 +37830,457 @@ class ClassificationLegend {
     return this._container;
   }
 }
+class Colorbar {
+  /**
+   * Creates a new Colorbar instance.
+   *
+   * @param options - Colorbar configuration options
+   */
+  constructor(options) {
+    __publicField(this, "_options");
+    __publicField(this, "_canvas");
+    __publicField(this, "_minLabel");
+    __publicField(this, "_maxLabel");
+    this._options = { ...options };
+  }
+  /**
+   * Renders the colorbar component.
+   *
+   * @returns The colorbar container element
+   */
+  render() {
+    const container = document.createElement("div");
+    container.className = "lidar-colorbar";
+    if (this._options.label) {
+      const label = document.createElement("div");
+      label.className = "lidar-colorbar-label";
+      label.textContent = this._options.label;
+      container.appendChild(label);
+    }
+    const canvas = document.createElement("canvas");
+    canvas.className = "lidar-colorbar-gradient";
+    canvas.width = 200;
+    canvas.height = 14;
+    this._canvas = canvas;
+    container.appendChild(canvas);
+    const labelsContainer = document.createElement("div");
+    labelsContainer.className = "lidar-colorbar-labels";
+    const minLabel = document.createElement("span");
+    minLabel.className = "lidar-colorbar-min";
+    this._minLabel = minLabel;
+    const maxLabel = document.createElement("span");
+    maxLabel.className = "lidar-colorbar-max";
+    this._maxLabel = maxLabel;
+    labelsContainer.appendChild(minLabel);
+    labelsContainer.appendChild(maxLabel);
+    container.appendChild(labelsContainer);
+    this._drawGradient();
+    this._updateLabels();
+    return container;
+  }
+  /**
+   * Updates the colorbar with new options.
+   *
+   * @param options - Partial options to update
+   */
+  update(options) {
+    if (options.colormap !== void 0) {
+      this._options.colormap = options.colormap;
+    }
+    if (options.minValue !== void 0) {
+      this._options.minValue = options.minValue;
+    }
+    if (options.maxValue !== void 0) {
+      this._options.maxValue = options.maxValue;
+    }
+    if (options.label !== void 0) {
+      this._options.label = options.label;
+    }
+    this._drawGradient();
+    this._updateLabels();
+  }
+  /**
+   * Sets the colormap.
+   *
+   * @param colormap - The colormap name
+   */
+  setColormap(colormap) {
+    this._options.colormap = colormap;
+    this._drawGradient();
+  }
+  /**
+   * Sets the value range.
+   *
+   * @param min - Minimum value
+   * @param max - Maximum value
+   */
+  setRange(min, max) {
+    this._options.minValue = min;
+    this._options.maxValue = max;
+    this._updateLabels();
+  }
+  /**
+   * Gets the current colormap.
+   *
+   * @returns The current colormap name
+   */
+  getColormap() {
+    return this._options.colormap;
+  }
+  /**
+   * Gets the current value range.
+   *
+   * @returns Object with min and max values
+   */
+  getRange() {
+    return {
+      min: this._options.minValue,
+      max: this._options.maxValue
+    };
+  }
+  /**
+   * Draws the color gradient on the canvas.
+   */
+  _drawGradient() {
+    if (!this._canvas) return;
+    const ctx = this._canvas.getContext("2d");
+    if (!ctx) return;
+    const width = this._canvas.width;
+    const height = this._canvas.height;
+    const ramp = COLORMAPS[this._options.colormap] || COLORMAPS.viridis;
+    const gradient = ctx.createLinearGradient(0, 0, width, 0);
+    for (let i = 0; i < ramp.length; i++) {
+      const t = i / (ramp.length - 1);
+      const [r, g, b] = ramp[i];
+      gradient.addColorStop(t, `rgb(${r}, ${g}, ${b})`);
+    }
+    ctx.fillStyle = gradient;
+    ctx.fillRect(0, 0, width, height);
+  }
+  /**
+   * Updates the min/max value labels.
+   */
+  _updateLabels() {
+    if (this._minLabel) {
+      this._minLabel.textContent = this._formatValue(this._options.minValue);
+    }
+    if (this._maxLabel) {
+      this._maxLabel.textContent = this._formatValue(this._options.maxValue);
+    }
+  }
+  /**
+   * Formats a value for display.
+   *
+   * @param value - The value to format
+   * @returns Formatted string
+   */
+  _formatValue(value) {
+    if (!Number.isFinite(value)) {
+      return "—";
+    }
+    const range = Math.abs(this._options.maxValue - this._options.minValue);
+    if (range < 1) {
+      return value.toFixed(3);
+    } else if (range < 10) {
+      return value.toFixed(2);
+    } else if (range < 100) {
+      return value.toFixed(1);
+    } else {
+      return value.toFixed(0);
+    }
+  }
+}
+const DEFAULT_PERCENTILE_LOW = 2;
+const DEFAULT_PERCENTILE_HIGH = 98;
+class PercentileRangeControl {
+  /**
+   * Creates a new PercentileRangeControl instance.
+   *
+   * @param options - Control configuration options
+   */
+  constructor(options) {
+    __publicField(this, "_options");
+    __publicField(this, "_percentileRadio");
+    __publicField(this, "_absoluteRadio");
+    __publicField(this, "_percentileSliderContainer");
+    __publicField(this, "_absoluteSliderContainer");
+    __publicField(this, "_percentileSlider");
+    __publicField(this, "_absoluteSlider");
+    __publicField(this, "_computedBounds");
+    this._options = { ...options };
+    this._computedBounds = options.computedBounds;
+  }
+  /**
+   * Renders the control component.
+   *
+   * @returns The control container element
+   */
+  render() {
+    const container = document.createElement("div");
+    container.className = "lidar-color-range";
+    const labelRow = document.createElement("div");
+    labelRow.className = "lidar-color-range-header";
+    const label = document.createElement("div");
+    label.className = "lidar-control-label";
+    label.textContent = "Color Range";
+    labelRow.appendChild(label);
+    const resetButton = document.createElement("button");
+    resetButton.className = "lidar-range-reset-btn";
+    resetButton.textContent = "Reset";
+    resetButton.title = "Reset to default (2-98% percentile)";
+    resetButton.addEventListener("click", () => this._onReset());
+    labelRow.appendChild(resetButton);
+    container.appendChild(labelRow);
+    const modeContainer = document.createElement("div");
+    modeContainer.className = "lidar-range-mode";
+    const percentileLabel = document.createElement("label");
+    const percentileRadio = document.createElement("input");
+    percentileRadio.type = "radio";
+    percentileRadio.name = "lidar-range-mode";
+    percentileRadio.value = "percentile";
+    percentileRadio.checked = this._options.config.mode === "percentile";
+    this._percentileRadio = percentileRadio;
+    percentileLabel.appendChild(percentileRadio);
+    percentileLabel.appendChild(document.createTextNode(" Percentile"));
+    modeContainer.appendChild(percentileLabel);
+    const absoluteLabel = document.createElement("label");
+    const absoluteRadio = document.createElement("input");
+    absoluteRadio.type = "radio";
+    absoluteRadio.name = "lidar-range-mode";
+    absoluteRadio.value = "absolute";
+    absoluteRadio.checked = this._options.config.mode === "absolute";
+    this._absoluteRadio = absoluteRadio;
+    absoluteLabel.appendChild(absoluteRadio);
+    absoluteLabel.appendChild(document.createTextNode(" Absolute"));
+    modeContainer.appendChild(absoluteLabel);
+    container.appendChild(modeContainer);
+    const percentileSliderContainer = document.createElement("div");
+    percentileSliderContainer.style.display = this._options.config.mode === "percentile" ? "block" : "none";
+    this._percentileSliderContainer = percentileSliderContainer;
+    this._percentileSlider = new DualRangeSlider({
+      label: "",
+      min: 0,
+      max: 100,
+      step: 1,
+      valueLow: this._options.config.percentileLow ?? DEFAULT_PERCENTILE_LOW,
+      valueHigh: this._options.config.percentileHigh ?? DEFAULT_PERCENTILE_HIGH,
+      onChange: (low, high) => this._onPercentileChange(low, high),
+      formatValue: (v) => `${v.toFixed(0)}%`
+    });
+    percentileSliderContainer.appendChild(this._percentileSlider.render());
+    container.appendChild(percentileSliderContainer);
+    const absoluteSliderContainer = document.createElement("div");
+    absoluteSliderContainer.style.display = this._options.config.mode === "absolute" ? "block" : "none";
+    this._absoluteSliderContainer = absoluteSliderContainer;
+    const dataBounds = this._options.dataBounds || { min: 0, max: 100 };
+    const absMin = this._options.config.absoluteMin ?? dataBounds.min;
+    const absMax = this._options.config.absoluteMax ?? dataBounds.max;
+    this._absoluteSlider = new DualRangeSlider({
+      label: "",
+      min: dataBounds.min,
+      max: dataBounds.max,
+      step: this._getAbsoluteStep(dataBounds),
+      valueLow: absMin,
+      valueHigh: absMax,
+      onChange: (low, high) => this._onAbsoluteChange(low, high),
+      formatValue: (v) => this._formatAbsoluteValue(v)
+    });
+    absoluteSliderContainer.appendChild(this._absoluteSlider.render());
+    container.appendChild(absoluteSliderContainer);
+    percentileRadio.addEventListener("change", () => this._onModeChange());
+    absoluteRadio.addEventListener("change", () => this._onModeChange());
+    return container;
+  }
+  /**
+   * Updates the control with new configuration.
+   *
+   * @param config - New color range configuration
+   */
+  setConfig(config) {
+    this._options.config = { ...config };
+    if (this._percentileRadio && this._absoluteRadio) {
+      this._percentileRadio.checked = config.mode === "percentile";
+      this._absoluteRadio.checked = config.mode === "absolute";
+    }
+    if (this._percentileSlider) {
+      this._percentileSlider.setRange(
+        config.percentileLow ?? DEFAULT_PERCENTILE_LOW,
+        config.percentileHigh ?? DEFAULT_PERCENTILE_HIGH
+      );
+    }
+    if (this._absoluteSlider) {
+      const dataBounds = this._options.dataBounds || { min: 0, max: 100 };
+      this._absoluteSlider.setRange(
+        config.absoluteMin ?? dataBounds.min,
+        config.absoluteMax ?? dataBounds.max
+      );
+    }
+    this._updateSlidersVisibility();
+  }
+  /**
+   * Updates the data bounds (for absolute mode reference).
+   *
+   * @param bounds - Data bounds
+   */
+  setDataBounds(bounds2) {
+    this._options.dataBounds = bounds2;
+    if (this._absoluteSlider) {
+      this._absoluteSlider.setBounds(bounds2.min, bounds2.max);
+      this._absoluteSlider.setStep(this._getAbsoluteStep(bounds2));
+      if (this._options.config.absoluteMin === void 0) {
+        this._options.config.absoluteMin = bounds2.min;
+      }
+      if (this._options.config.absoluteMax === void 0) {
+        this._options.config.absoluteMax = bounds2.max;
+      }
+      const currentMin = this._options.config.absoluteMin ?? bounds2.min;
+      const currentMax = this._options.config.absoluteMax ?? bounds2.max;
+      const clampedMin = Math.max(bounds2.min, Math.min(bounds2.max, currentMin));
+      const clampedMax = Math.max(bounds2.min, Math.min(bounds2.max, currentMax));
+      this._absoluteSlider.setRange(clampedMin, clampedMax);
+    }
+  }
+  /**
+   * Sets the actual computed bounds from percentile calculation.
+   * These bounds are used when switching from percentile to absolute mode.
+   *
+   * @param bounds - The actual computed bounds
+   */
+  setComputedBounds(bounds2) {
+    this._computedBounds = bounds2;
+  }
+  /**
+   * Gets the current configuration.
+   *
+   * @returns The current color range configuration
+   */
+  getConfig() {
+    return { ...this._options.config };
+  }
+  /**
+   * Handles percentile slider change.
+   */
+  _onPercentileChange(low, high) {
+    this._options.config.percentileLow = low;
+    this._options.config.percentileHigh = high;
+    this._emitChange();
+  }
+  /**
+   * Handles absolute slider change.
+   */
+  _onAbsoluteChange(low, high) {
+    this._options.config.absoluteMin = low;
+    this._options.config.absoluteMax = high;
+    this._emitChange();
+  }
+  /**
+   * Handles mode change (percentile/absolute toggle).
+   * Syncs values when switching between modes using actual computed bounds.
+   */
+  _onModeChange() {
+    var _a;
+    const newMode = ((_a = this._percentileRadio) == null ? void 0 : _a.checked) ? "percentile" : "absolute";
+    const oldMode = this._options.config.mode;
+    if (newMode !== oldMode) {
+      if (newMode === "absolute") {
+        if (this._computedBounds) {
+          this._options.config.absoluteMin = this._computedBounds.min;
+          this._options.config.absoluteMax = this._computedBounds.max;
+        } else if (this._options.dataBounds) {
+          const { min: dataMin, max: dataMax } = this._options.dataBounds;
+          const range = dataMax - dataMin;
+          const pLow = this._options.config.percentileLow ?? DEFAULT_PERCENTILE_LOW;
+          const pHigh = this._options.config.percentileHigh ?? DEFAULT_PERCENTILE_HIGH;
+          this._options.config.absoluteMin = parseFloat((dataMin + range * (pLow / 100)).toFixed(2));
+          this._options.config.absoluteMax = parseFloat((dataMin + range * (pHigh / 100)).toFixed(2));
+        }
+        if (this._absoluteSlider && this._options.config.absoluteMin !== void 0 && this._options.config.absoluteMax !== void 0) {
+          this._absoluteSlider.setRange(this._options.config.absoluteMin, this._options.config.absoluteMax);
+        }
+      }
+    }
+    this._options.config.mode = newMode;
+    this._updateSlidersVisibility();
+    this._emitChange();
+  }
+  /**
+   * Handles reset button click.
+   * Resets to default percentile mode with 2-98% range.
+   */
+  _onReset() {
+    this._options.config.mode = "percentile";
+    this._options.config.percentileLow = DEFAULT_PERCENTILE_LOW;
+    this._options.config.percentileHigh = DEFAULT_PERCENTILE_HIGH;
+    if (this._options.dataBounds) {
+      const { min: dataMin, max: dataMax } = this._options.dataBounds;
+      const range = dataMax - dataMin;
+      this._options.config.absoluteMin = parseFloat((dataMin + range * (DEFAULT_PERCENTILE_LOW / 100)).toFixed(2));
+      this._options.config.absoluteMax = parseFloat((dataMin + range * (DEFAULT_PERCENTILE_HIGH / 100)).toFixed(2));
+    }
+    if (this._percentileRadio) {
+      this._percentileRadio.checked = true;
+    }
+    if (this._absoluteRadio) {
+      this._absoluteRadio.checked = false;
+    }
+    if (this._percentileSlider) {
+      this._percentileSlider.setRange(DEFAULT_PERCENTILE_LOW, DEFAULT_PERCENTILE_HIGH);
+    }
+    if (this._absoluteSlider && this._options.config.absoluteMin !== void 0 && this._options.config.absoluteMax !== void 0) {
+      this._absoluteSlider.setRange(this._options.config.absoluteMin, this._options.config.absoluteMax);
+    }
+    this._updateSlidersVisibility();
+    this._emitChange();
+  }
+  /**
+   * Updates the visibility of slider containers based on mode.
+   */
+  _updateSlidersVisibility() {
+    if (this._percentileSliderContainer) {
+      this._percentileSliderContainer.style.display = this._options.config.mode === "percentile" ? "block" : "none";
+    }
+    if (this._absoluteSliderContainer) {
+      this._absoluteSliderContainer.style.display = this._options.config.mode === "absolute" ? "block" : "none";
+    }
+  }
+  /**
+   * Gets the appropriate step value for absolute slider based on data range.
+   */
+  _getAbsoluteStep(bounds2) {
+    const range = bounds2.max - bounds2.min;
+    if (range <= 1) {
+      return 0.01;
+    } else if (range <= 10) {
+      return 0.1;
+    } else if (range <= 100) {
+      return 1;
+    } else if (range <= 1e3) {
+      return 1;
+    } else {
+      return Math.round(range / 100);
+    }
+  }
+  /**
+   * Formats absolute value for display based on the data range.
+   */
+  _formatAbsoluteValue(value) {
+    const bounds2 = this._options.dataBounds || { min: 0, max: 100 };
+    const range = bounds2.max - bounds2.min;
+    if (range <= 1) {
+      return value.toFixed(2);
+    } else if (range <= 10) {
+      return value.toFixed(1);
+    } else {
+      return value.toFixed(0);
+    }
+  }
+  /**
+   * Emits a change event with the current configuration.
+   */
+  _emitChange() {
+    this._options.onChange({ ...this._options.config });
+  }
+}
 class PanelBuilder {
   constructor(callbacks, initialState) {
     __publicField(this, "_callbacks");
@@ -37320,6 +38291,12 @@ class PanelBuilder {
     __publicField(this, "_urlInput");
     __publicField(this, "_loadButton");
     __publicField(this, "_colorSelect");
+    __publicField(this, "_colormapSelect");
+    __publicField(this, "_colormapGroup");
+    __publicField(this, "_colorbar");
+    __publicField(this, "_colorbarContainer");
+    __publicField(this, "_colorRangeControl");
+    __publicField(this, "_colorRangeContainer");
     __publicField(this, "_percentileCheckbox");
     __publicField(this, "_percentileGroup");
     __publicField(this, "_pointSizeSlider");
@@ -37395,6 +38372,25 @@ class PanelBuilder {
       this._colorSelect.value = state.colorScheme;
       this._updatePercentileVisibility(state.colorScheme);
     }
+    if (this._colormapSelect && state.colormap) {
+      this._colormapSelect.value = state.colormap;
+    }
+    if (this._colorbar) {
+      if (state.colormap) {
+        this._colorbar.setColormap(state.colormap);
+      }
+      if (state.computedColorBounds) {
+        this._colorbar.setRange(state.computedColorBounds.min, state.computedColorBounds.max);
+      }
+    }
+    if (this._colorRangeControl && state.colorRange) {
+      this._colorRangeControl.setConfig(state.colorRange);
+      const bounds2 = this._getDataBoundsForCurrentScheme();
+      this._colorRangeControl.setDataBounds(bounds2);
+      if (state.computedColorBounds) {
+        this._colorRangeControl.setComputedBounds(state.computedColorBounds);
+      }
+    }
     if (this._percentileCheckbox) {
       this._percentileCheckbox.checked = state.usePercentile ?? true;
     }
@@ -37535,8 +38531,10 @@ class PanelBuilder {
     this._colorSelect = colorSelect;
     colorGroup.appendChild(colorSelect);
     section.appendChild(colorGroup);
+    section.appendChild(this._buildColormapSelector());
+    section.appendChild(this._buildColorbar());
     section.appendChild(this._buildClassificationLegend());
-    section.appendChild(this._buildPercentileCheckbox());
+    section.appendChild(this._buildColorRangeControl());
     this._pointSizeSlider = new RangeSlider({
       label: "Point Size",
       min: 1,
@@ -37721,46 +38719,120 @@ class PanelBuilder {
     return { min: minZ, max: maxZ };
   }
   /**
-   * Builds the percentile checkbox control for elevation/intensity coloring.
+   * Gets the intensity bounds.
+   * Intensity values are normalized to 0-1 range during loading.
+   */
+  _getIntensityBounds() {
+    return { min: 0, max: 1 };
+  }
+  /**
+   * Gets the appropriate data bounds based on the current color scheme.
    */
-  _buildPercentileCheckbox() {
+  _getDataBoundsForCurrentScheme() {
+    const colorScheme = typeof this._state.colorScheme === "string" ? this._state.colorScheme : "elevation";
+    if (colorScheme === "intensity") {
+      return this._getIntensityBounds();
+    }
+    return this._getElevationBounds();
+  }
+  /**
+   * Builds the colormap selector dropdown.
+   */
+  _buildColormapSelector() {
     const group = document.createElement("div");
-    group.className = "lidar-control-group";
-    this._percentileGroup = group;
-    const labelRow = document.createElement("div");
-    labelRow.className = "lidar-control-label-row";
-    labelRow.style.cursor = "pointer";
-    const checkbox = document.createElement("input");
-    checkbox.type = "checkbox";
-    checkbox.id = "lidar-percentile-checkbox";
-    checkbox.checked = this._state.usePercentile ?? true;
-    checkbox.style.marginRight = "6px";
-    this._percentileCheckbox = checkbox;
+    group.className = "lidar-colormap-group";
+    this._colormapGroup = group;
+    const currentScheme = typeof this._state.colorScheme === "string" ? this._state.colorScheme : "elevation";
+    const showColormap = currentScheme === "elevation" || currentScheme === "intensity";
+    group.style.display = showColormap ? "block" : "none";
     const label = document.createElement("label");
     label.className = "lidar-control-label";
-    label.htmlFor = "lidar-percentile-checkbox";
-    label.style.display = "inline";
-    label.style.cursor = "pointer";
-    label.textContent = "Use percentile range (2-98%)";
-    label.title = "Clip outliers for better color distribution";
-    checkbox.addEventListener("change", () => {
-      this._callbacks.onUsePercentileChange(checkbox.checked);
+    label.textContent = "Colormap";
+    group.appendChild(label);
+    const select = document.createElement("select");
+    select.className = "lidar-colormap-select";
+    for (const name of COLORMAP_NAMES) {
+      const option = document.createElement("option");
+      option.value = name;
+      option.textContent = COLORMAP_LABELS[name];
+      select.appendChild(option);
+    }
+    select.value = this._state.colormap || "viridis";
+    this._colormapSelect = select;
+    select.addEventListener("change", () => {
+      const colormap = select.value;
+      this._callbacks.onColormapChange(colormap);
     });
-    labelRow.appendChild(checkbox);
-    labelRow.appendChild(label);
-    group.appendChild(labelRow);
-    const currentScheme = typeof this._state.colorScheme === "string" ? this._state.colorScheme : "elevation";
-    this._updatePercentileVisibility(currentScheme);
+    group.appendChild(select);
     return group;
   }
   /**
-   * Updates the visibility of the percentile checkbox and classification legend based on color scheme.
-   * Percentile shows for elevation and intensity. Legend shows for classification.
+   * Builds the colorbar component.
+   */
+  _buildColorbar() {
+    var _a, _b;
+    const container = document.createElement("div");
+    container.className = "lidar-control-group";
+    this._colorbarContainer = container;
+    const currentScheme = typeof this._state.colorScheme === "string" ? this._state.colorScheme : "elevation";
+    const showColorbar = (currentScheme === "elevation" || currentScheme === "intensity") && this._state.showColorbar;
+    container.style.display = showColorbar ? "block" : "none";
+    this._colorbar = new Colorbar({
+      colormap: this._state.colormap || "viridis",
+      minValue: ((_a = this._state.computedColorBounds) == null ? void 0 : _a.min) ?? 0,
+      maxValue: ((_b = this._state.computedColorBounds) == null ? void 0 : _b.max) ?? 100
+    });
+    container.appendChild(this._colorbar.render());
+    return container;
+  }
+  /**
+   * Builds the color range control (replaces percentile checkbox).
+   */
+  _buildColorRangeControl() {
+    const container = document.createElement("div");
+    container.className = "lidar-control-group";
+    this._colorRangeContainer = container;
+    const currentScheme = typeof this._state.colorScheme === "string" ? this._state.colorScheme : "elevation";
+    const showControl = currentScheme === "elevation" || currentScheme === "intensity";
+    container.style.display = showControl ? "block" : "none";
+    const dataBounds = this._getDataBoundsForCurrentScheme();
+    this._colorRangeControl = new PercentileRangeControl({
+      config: this._state.colorRange || {
+        mode: "percentile",
+        percentileLow: 2,
+        percentileHigh: 98
+      },
+      dataBounds,
+      computedBounds: this._state.computedColorBounds,
+      onChange: (config) => {
+        this._callbacks.onColorRangeChange(config);
+      }
+    });
+    container.appendChild(this._colorRangeControl.render());
+    return container;
+  }
+  /**
+   * Updates the visibility of color-related controls based on color scheme.
+   * Shows colormap/colorbar/range for elevation and intensity.
+   * Shows classification legend for classification.
    */
   _updatePercentileVisibility(colorScheme) {
+    const showColorControls = colorScheme === "elevation" || colorScheme === "intensity";
+    if (this._colormapGroup) {
+      this._colormapGroup.style.display = showColorControls ? "block" : "none";
+    }
+    if (this._colorbarContainer) {
+      this._colorbarContainer.style.display = showColorControls && this._state.showColorbar ? "block" : "none";
+    }
+    if (this._colorRangeContainer) {
+      this._colorRangeContainer.style.display = showColorControls ? "block" : "none";
+    }
+    if (this._colorRangeControl && showColorControls) {
+      const bounds2 = this._getDataBoundsForCurrentScheme();
+      this._colorRangeControl.setDataBounds(bounds2);
+    }
     if (this._percentileGroup) {
-      const showPercentile = colorScheme === "elevation" || colorScheme === "intensity";
-      this._percentileGroup.style.display = showPercentile ? "block" : "none";
+      this._percentileGroup.style.display = "none";
     }
     if (this._classificationLegendContainer) {
       this._classificationLegendContainer.style.display = colorScheme === "classification" ? "block" : "none";
@@ -37927,6 +38999,9 @@ const DEFAULT_OPTIONS = {
   opacity: 1,
   colorScheme: "elevation",
   usePercentile: true,
+  colormap: "viridis",
+  colorRange: { mode: "percentile", percentileLow: 2, percentileHigh: 98 },
+  showColorbar: true,
   pointBudget: 1e6,
   elevationRange: null,
   pickable: false,
@@ -37973,7 +39048,14 @@ class LidarControl {
     __publicField(this, "_streamingLoaders", /* @__PURE__ */ new Map());
     __publicField(this, "_eptStreamingLoaders", /* @__PURE__ */ new Map());
     __publicField(this, "_viewportManagers", /* @__PURE__ */ new Map());
+    __publicField(this, "_eptViewportRequestIds", /* @__PURE__ */ new Map());
+    __publicField(this, "_eptLastViewport", /* @__PURE__ */ new Map());
     this._options = { ...DEFAULT_OPTIONS, ...options };
+    const defaultColorRange = this._options.colorRange ?? {
+      mode: "percentile",
+      percentileLow: 2,
+      percentileHigh: 98
+    };
     this._state = {
       collapsed: this._options.collapsed,
       panelWidth: this._options.panelWidth,
@@ -37983,6 +39065,9 @@ class LidarControl {
       pointSize: this._options.pointSize,
       opacity: this._options.opacity,
       colorScheme: this._options.colorScheme,
+      colormap: this._options.colormap ?? "viridis",
+      colorRange: defaultColorRange,
+      showColorbar: this._options.showColorbar ?? true,
       usePercentile: this._options.usePercentile,
       elevationRange: this._options.elevationRange,
       pointBudget: this._options.pointBudget,
@@ -38178,7 +39263,7 @@ class LidarControl {
    * @returns Promise resolving to the point cloud info
    */
   async loadPointCloud(source, options) {
-    var _a, _b, _c;
+    var _a, _b, _c, _d;
     const isEptUrl = typeof source === "string" && (source.endsWith("/ept.json") || source.includes("/ept.json?"));
     if (isEptUrl) {
       return this.loadPointCloudEptStreaming(source);
@@ -38253,6 +39338,8 @@ class LidarControl {
         zOffset: zOffset ?? this._state.zOffset,
         zOffsetEnabled
       });
+      this._updateComputedColorBounds();
+      (_c = this._panelBuilder) == null ? void 0 : _c.updateState(this._state);
       this._emitWithData("load", { pointCloud: info2 });
       if (this._options.autoZoom) {
         this.flyToPointCloud(id);
@@ -38266,7 +39353,7 @@ class LidarControl {
         console.warn(
           `CORS error detected for ${source}. Falling back to download mode...`
         );
-        (_c = this._panelBuilder) == null ? void 0 : _c.updateLoadingProgress(5, "CORS blocked - downloading file...");
+        (_d = this._panelBuilder) == null ? void 0 : _d.updateLoadingProgress(5, "CORS blocked - downloading file...");
         return this._loadPointCloudFullDownload(source);
       }
       this.setState({
@@ -38324,7 +39411,7 @@ class LidarControl {
    * @returns Promise resolving to initial point cloud info
    */
   async loadPointCloudStreaming(source, options) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e;
     const id = generateId("pc-stream");
     let name;
     if (typeof source === "string") {
@@ -38429,12 +39516,18 @@ class LidarControl {
         pointClouds,
         activePointCloudId: id
       });
+      this._updateComputedColorBounds();
+      (_c = this._panelBuilder) == null ? void 0 : _c.updateState(this._state);
       viewportManager.start();
       if (this._options.autoZoom) {
-        (_c = this._map) == null ? void 0 : _c.fitBounds(
+        const clampedMinY = Math.max(-90, Math.min(90, bounds2.minY));
+        const clampedMaxY = Math.max(-90, Math.min(90, bounds2.maxY));
+        const clampedMinX = Math.max(-180, Math.min(180, bounds2.minX));
+        const clampedMaxX = Math.max(-180, Math.min(180, bounds2.maxX));
+        (_d = this._map) == null ? void 0 : _d.fitBounds(
           [
-            [bounds2.minX, bounds2.minY],
-            [bounds2.maxX, bounds2.maxY]
+            [clampedMinX, clampedMinY],
+            [clampedMaxX, clampedMaxY]
           ],
           {
             padding: 50,
@@ -38470,7 +39563,7 @@ class LidarControl {
           streamingActive: hasActiveStreaming,
           error: null
         });
-        (_d = this._panelBuilder) == null ? void 0 : _d.updateLoadingProgress(5, "CORS blocked - downloading file...");
+        (_e = this._panelBuilder) == null ? void 0 : _e.updateLoadingProgress(5, "CORS blocked - downloading file...");
         return this._loadPointCloudFullDownload(source);
       }
       this.setState({
@@ -38491,7 +39584,7 @@ class LidarControl {
    * @returns Promise resolving to initial point cloud info
    */
   async loadPointCloudEptStreaming(eptUrl, options) {
-    var _a, _b, _c, _d;
+    var _a, _b, _c, _d, _e;
     const id = generateId("ept-stream");
     const name = getFilename(eptUrl.replace("/ept.json", ""));
     this.setState({ loading: true, error: null, streamingActive: true });
@@ -38589,12 +39682,18 @@ class LidarControl {
         pointClouds,
         activePointCloudId: id
       });
+      this._updateComputedColorBounds();
+      (_d = this._panelBuilder) == null ? void 0 : _d.updateState(this._state);
       viewportManager.start();
       if (this._options.autoZoom) {
-        (_d = this._map) == null ? void 0 : _d.fitBounds(
+        const clampedMinY = Math.max(-90, Math.min(90, bounds2.minY));
+        const clampedMaxY = Math.max(-90, Math.min(90, bounds2.maxY));
+        const clampedMinX = Math.max(-180, Math.min(180, bounds2.minX));
+        const clampedMaxX = Math.max(-180, Math.min(180, bounds2.maxX));
+        (_e = this._map) == null ? void 0 : _e.fitBounds(
           [
-            [bounds2.minX, bounds2.minY],
-            [bounds2.maxX, bounds2.maxY]
+            [clampedMinX, clampedMinY],
+            [clampedMaxX, clampedMaxY]
           ],
           {
             padding: 50,
@@ -38614,6 +39713,8 @@ class LidarControl {
         eptLoader.destroy();
         this._eptStreamingLoaders.delete(id);
       }
+      this._eptViewportRequestIds.delete(id);
+      this._eptLastViewport.delete(id);
       const viewportManager = this._viewportManagers.get(id);
       if (viewportManager) {
         viewportManager.destroy();
@@ -38635,15 +39736,77 @@ class LidarControl {
    * @param viewport - Current viewport information
    * @param datasetId - ID of the EPT dataset
    */
-  async _handleViewportChangeForEptStreaming(viewport, datasetId) {
+  _shouldResetEptForViewportChange(previous, current) {
+    if (!previous) return false;
+    const [prevWest, prevSouth, prevEast, prevNorth] = previous.bounds;
+    const [curWest, curSouth, curEast, curNorth] = current.bounds;
+    const intersects = !(curEast < prevWest || curWest > prevEast || curNorth < prevSouth || curSouth > prevNorth);
+    if (!intersects) return true;
+    const prevWidth = prevEast - prevWest;
+    const prevHeight = prevNorth - prevSouth;
+    const dx = current.center[0] - previous.center[0];
+    const dy = current.center[1] - previous.center[1];
+    const centerDistance = Math.sqrt(dx * dx + dy * dy);
+    const threshold = Math.max(prevWidth, prevHeight) * 0.3;
+    return centerDistance > threshold;
+  }
+  async _handleViewportChangeForEptStreaming(viewport, datasetId, requestId) {
     const eptLoader = this._eptStreamingLoaders.get(datasetId);
     if (!eptLoader) return;
     try {
-      const nodesToLoad = await eptLoader.selectNodesForViewport(viewport);
+      const currentRequestId = requestId ?? (this._eptViewportRequestIds.get(datasetId) ?? 0) + 1;
+      if (requestId === void 0) {
+        this._eptViewportRequestIds.set(datasetId, currentRequestId);
+      }
+      if (this._eptViewportRequestIds.get(datasetId) !== currentRequestId) return;
+      const previousViewport = this._eptLastViewport.get(datasetId);
+      const shouldResetForMove = this._shouldResetEptForViewportChange(previousViewport, viewport);
+      this._eptLastViewport.set(datasetId, viewport);
+      eptLoader.pruneQueueForViewport(viewport);
+      if (shouldResetForMove) {
+        const resetSucceeded2 = eptLoader.resetLoadedData();
+        if (!resetSucceeded2) {
+          setTimeout(() => {
+            this._handleViewportChangeForEptStreaming(viewport, datasetId, currentRequestId);
+          }, 200);
+          return;
+        }
+      }
+      let nodesToLoad = await eptLoader.selectNodesForViewport(viewport);
+      let resetSucceeded = false;
+      const loadedPoints = eptLoader.getLoadedPointCount();
+      const pointBudget = eptLoader.getPointBudget();
+      const budgetReached = loadedPoints >= pointBudget * 0.8;
+      const minDepthForCoverage = Math.max(0, viewport.targetDepth - 2);
+      const coverageRatio = eptLoader.getViewportCoverageRatio(viewport, minDepthForCoverage);
+      const needsCoverage = coverageRatio < 0.5;
+      const hasPendingSubtrees = eptLoader.hasPendingSubtrees(viewport);
+      const hasPendingWork = nodesToLoad.length > 0 || hasPendingSubtrees;
+      if (budgetReached && needsCoverage && hasPendingWork) {
+        resetSucceeded = eptLoader.resetLoadedData();
+        if (resetSucceeded) {
+          nodesToLoad = await eptLoader.selectNodesForViewport(viewport);
+        }
+      }
+      if (!budgetReached && coverageRatio < 0.1 && nodesToLoad.length === 0) {
+        nodesToLoad = await eptLoader.selectNodesForViewport(viewport);
+      }
       for (const node of nodesToLoad) {
         eptLoader.queueNode(node);
       }
       await eptLoader.loadQueuedNodes();
+      if (this._eptViewportRequestIds.get(datasetId) !== currentRequestId) return;
+      if (budgetReached && needsCoverage && nodesToLoad.length > 0 && !resetSucceeded) {
+        setTimeout(() => {
+          this._handleViewportChangeForEptStreaming(viewport, datasetId, currentRequestId);
+        }, 200);
+        return;
+      }
+      if (hasPendingSubtrees) {
+        setTimeout(() => {
+          this._handleViewportChangeForEptStreaming(viewport, datasetId, currentRequestId);
+        }, 100);
+      }
     } catch (err) {
       console.warn("Failed to load EPT nodes for viewport:", err);
     }
@@ -38653,7 +39816,7 @@ class LidarControl {
    * Used as fallback when streaming fails due to CORS.
    */
   async _loadPointCloudFullDownload(url) {
-    var _a, _b, _c, _d, _e, _f, _g, _h;
+    var _a, _b, _c, _d, _e, _f, _g, _h, _i;
     const id = generateId("pc");
     const name = getFilename(url);
     try {
@@ -38740,6 +39903,8 @@ class LidarControl {
         zOffset: zOffset ?? this._state.zOffset,
         zOffsetEnabled
       });
+      this._updateComputedColorBounds();
+      (_i = this._panelBuilder) == null ? void 0 : _i.updateState(this._state);
       this._emitWithData("load", { pointCloud: info2 });
       if (this._options.autoZoom) {
         this.flyToPointCloud(id);
@@ -38836,6 +40001,8 @@ class LidarControl {
         eptLoader.destroy();
       }
       this._eptStreamingLoaders.clear();
+      this._eptViewportRequestIds.clear();
+      this._eptLastViewport.clear();
       for (const streamingId of streamingIds) {
         (_c = this._pointCloudManager) == null ? void 0 : _c.removePointCloud(streamingId);
       }
@@ -38904,16 +40071,84 @@ class LidarControl {
   }
   /**
    * Sets the color scheme.
+   * Automatically switches colormap and resets color range when changing between elevation and intensity.
    *
    * @param scheme - Color scheme to apply
    */
   setColorScheme(scheme) {
-    var _a;
+    var _a, _b, _c, _d, _e;
+    const previousScheme = this._state.colorScheme;
     this._state.colorScheme = scheme;
     (_a = this._pointCloudManager) == null ? void 0 : _a.setColorScheme(scheme);
+    if (typeof scheme === "string" && typeof previousScheme === "string") {
+      const isNewElevationOrIntensity = scheme === "elevation" || scheme === "intensity";
+      const wasElevationOrIntensity = previousScheme === "elevation" || previousScheme === "intensity";
+      const switchedBetweenElevationAndIntensity = isNewElevationOrIntensity && wasElevationOrIntensity && scheme !== previousScheme;
+      if (switchedBetweenElevationAndIntensity) {
+        this._state.colorRange = {
+          mode: "percentile",
+          percentileLow: 2,
+          percentileHigh: 98
+        };
+        (_b = this._pointCloudManager) == null ? void 0 : _b.setColorRange(this._state.colorRange);
+      }
+      if (scheme === "intensity" && previousScheme !== "intensity") {
+        this._state.colormap = "gray";
+        (_c = this._pointCloudManager) == null ? void 0 : _c.setColormap("gray");
+      } else if (scheme === "elevation" && previousScheme === "intensity") {
+        this._state.colormap = "viridis";
+        (_d = this._pointCloudManager) == null ? void 0 : _d.setColormap("viridis");
+      }
+    }
+    this._updateComputedColorBounds();
+    (_e = this._panelBuilder) == null ? void 0 : _e.updateState(this._state);
+    this._emit("stylechange");
+    this._emit("statechange");
+  }
+  /**
+   * Sets the colormap for elevation/intensity coloring.
+   *
+   * @param colormap - The colormap name (e.g., 'viridis', 'plasma', 'turbo')
+   */
+  setColormap(colormap) {
+    var _a, _b;
+    this._state.colormap = colormap;
+    (_a = this._pointCloudManager) == null ? void 0 : _a.setColormap(colormap);
+    this._updateComputedColorBounds();
+    (_b = this._panelBuilder) == null ? void 0 : _b.updateState(this._state);
     this._emit("stylechange");
     this._emit("statechange");
   }
+  /**
+   * Gets the current colormap.
+   *
+   * @returns The current colormap name
+   */
+  getColormap() {
+    return this._state.colormap;
+  }
+  /**
+   * Sets the color range configuration.
+   *
+   * @param config - The color range configuration
+   */
+  setColorRange(config) {
+    var _a, _b;
+    this._state.colorRange = config;
+    (_a = this._pointCloudManager) == null ? void 0 : _a.setColorRange(config);
+    this._updateComputedColorBounds();
+    (_b = this._panelBuilder) == null ? void 0 : _b.updateState(this._state);
+    this._emit("stylechange");
+    this._emit("statechange");
+  }
+  /**
+   * Gets the current color range configuration.
+   *
+   * @returns The current color range configuration
+   */
+  getColorRange() {
+    return this._state.colorRange;
+  }
   /**
    * Sets whether to use percentile range for elevation/intensity coloring.
    *
@@ -39123,6 +40358,50 @@ class LidarControl {
       handlers.forEach((handler) => handler(eventData));
     }
   }
+  /**
+   * Updates the computed color bounds based on the current color scheme and range settings.
+   * This is used to display accurate min/max values in the colorbar.
+   */
+  _updateComputedColorBounds() {
+    var _a;
+    if (this._state.pointClouds.length === 0) {
+      this._state.computedColorBounds = void 0;
+      return;
+    }
+    const actualBounds = (_a = this._pointCloudManager) == null ? void 0 : _a.getLastComputedBounds();
+    if (actualBounds) {
+      this._state.computedColorBounds = actualBounds;
+    } else {
+      const colorScheme = typeof this._state.colorScheme === "string" ? this._state.colorScheme : "elevation";
+      if (colorScheme === "intensity") {
+        this._state.computedColorBounds = this._getIntensityBounds();
+      } else {
+        this._state.computedColorBounds = this._getElevationBounds();
+      }
+    }
+  }
+  /**
+   * Gets the elevation bounds from loaded point clouds.
+   */
+  _getElevationBounds() {
+    if (this._state.pointClouds.length === 0) {
+      return { min: 0, max: 100 };
+    }
+    let minZ = Infinity;
+    let maxZ = -Infinity;
+    for (const pc of this._state.pointClouds) {
+      minZ = Math.min(minZ, pc.bounds.minZ);
+      maxZ = Math.max(maxZ, pc.bounds.maxZ);
+    }
+    return { min: minZ, max: maxZ };
+  }
+  /**
+   * Gets the intensity bounds from loaded point clouds.
+   * Intensity values are typically normalized to 0-1 range.
+   */
+  _getIntensityBounds() {
+    return { min: 0, max: 1 };
+  }
   /**
    * Creates the main container element for the control.
    *
@@ -39183,6 +40462,8 @@ class LidarControl {
         onPointSizeChange: (size) => this.setPointSize(size),
         onOpacityChange: (opacity) => this.setOpacity(opacity),
         onColorSchemeChange: (scheme) => this.setColorScheme(scheme),
+        onColormapChange: (colormap) => this.setColormap(colormap),
+        onColorRangeChange: (config) => this.setColorRange(config),
         onUsePercentileChange: (usePercentile) => this.setUsePercentile(usePercentile),
         onElevationRangeChange: (range) => {
           if (range) {
@@ -39685,6 +40966,9 @@ class LidarLayerAdapter {
     this._changeCallbacks = [];
   }
 }
+exports.COLORMAPS = COLORMAPS;
+exports.COLORMAP_LABELS = COLORMAP_LABELS;
+exports.COLORMAP_NAMES = COLORMAP_NAMES;
 exports.ColorSchemeProcessor = ColorSchemeProcessor;
 exports.CopcStreamingLoader = CopcStreamingLoader;
 exports.DeckOverlay = DeckOverlay;
@@ -39702,6 +40986,7 @@ exports.formatNumber = formatNumber;
 exports.formatNumericValue = formatNumericValue;
 exports.generateId = generateId;
 exports.getClassificationName = getClassificationName;
+exports.getColormap = getColormap;
 exports.getFilename = getFilename;
 exports.throttle = throttle;
-//# sourceMappingURL=LidarLayerAdapter-BW2Hj7QW.cjs.map
+//# sourceMappingURL=LidarLayerAdapter-eh59KEMT.cjs.map