#613 Legends for Transformed Titiler COGs (#614)

* #613 Improved transform COG legend * #613 32bit cog legend and partial id tool * #613 Identifer Tool and other touchups
NASA-AMMOS · Jan 14, 2025 · 9099fc4 · 9099fc4
1 parent 2e4b608
commit 9099fc4
Show file tree

Hide file tree

Showing 7 changed files with 367 additions and 122 deletions.
diff --git a/configure/src/metaconfigs/layer-tile-config.json b/configure/src/metaconfigs/layer-tile-config.json
@@ -140,7 +140,7 @@
             {
               "field": "cogTransform",
               "name": "Transform COG",
-              "description": "Enable rescaling and coloring 32-bit COGs on the fly.",
+              "description": "Enable rescaling and coloring 32-bit COGs on the fly. Will use TiTiler.",
               "type": "switch",
               "width": 3,
               "defaultChecked": false
@@ -150,14 +150,21 @@
               "name": "Minimum Pixel Data Value",
               "description": "If using TiTiler, STAC and 32-bit COGs, the default minimum value for which to rescale.",
               "type": "number",
-              "width": 3
+              "width": 2
             },
             {
               "field": "cogMax",
               "name": "Maximum Pixel Data Value",
               "description": "If using TiTiler, STAC and 32-bit COGs, the default maximum value for which to rescale.",
               "type": "number",
-              "width": 3
+              "width": 2
+            },
+            {
+              "field": "cogUnits",
+              "name": "Units",
+              "description": "Units string by which to suffix values. For instance if the units are meters, use 'm' so that values are displayed as '100m'.",
+              "type": "text",
+              "width": 2
             },
             {
               "field": "cogColormap",

diff --git a/src/essence/Ancillary/TimeUI.css b/src/essence/Ancillary/TimeUI.css
@@ -110,7 +110,7 @@
     background: var(--color-a2);
 }
 #mmgisTimeUITimelineSlider .rangeSlider:after {
-    content: "";
+    content: '';
     position: absolute;
     width: 100%;
     height: 2px;
@@ -219,8 +219,9 @@
     pointer-events: none;
 }
 #mmgisTimeUITimelineHisto > div {
-    background: #056e94;
-    height: 100%;
+    background: var(--color-c);
+    height: 50%;
+    margin-top: 21px;
     transition: margin-top 0.2s ease-in-out;
 }
 
@@ -266,4 +267,4 @@
 }
 #mmgisTimeUIEndWrapperFake {
     right: 0;
-}
+}
diff --git a/src/essence/Ancillary/TimeUI.js b/src/essence/Ancillary/TimeUI.js
@@ -868,7 +868,7 @@ const TimeUI = {
         const endtimeISO = new Date(TimeUI._timelineEndTimestamp).toISOString()
 
         const NUM_BINS = Math.max(
-            Math.min(endTimestamp - startTimestamp, 360),
+            Math.min(endTimestamp - startTimestamp, 255),
             1
         )
         let bins = new Array(NUM_BINS).fill(0)
@@ -949,9 +949,9 @@ const TimeUI = {
                                 histoElm.append(
                                     `<div style="width:${
                                         (1 / numBins) * 100
-                                    }%; margin-top:${
-                                        40 - (b / minmax.max) * 40
-                                    }px"></div>`
+                                    }%; opacity:${
+                                        (b > 0 ? 20 : 0) + (b / minmax.max) * 80
+                                    }%;"></div>`
                                 )
                             })
                     }