@nika-js/onlymap 0.5.3 → 0.5.7

package/onlymapjs.html-data.json

@@ -281,6 +281,9 @@
             {
               "name": "IconLayer"
             },
+            {
+              "name": "ImageOverlay"
+            },
             {
               "name": "LineLayer"
             },
@@ -339,7 +342,7 @@
         },
         {
           "name": "data",
-          "description": "Data URL (JSON, GeoJSON, CSV/TSV, Arrow/GeoArrow IPC, Shapefile .shp, KML) or wss:// stream; omit for inline <script type=\"application/json\">."
+          "description": "Data URL (JSON, GeoJSON, CSV/TSV, Arrow/GeoArrow IPC, Shapefile .shp, KML, GPX, FlatGeobuf .fgb, GeoParquet .parquet, CityJSON) or wss:// stream; omit for inline <script type=\"application/json\">."
         },
         {
           "name": "label",
@@ -430,19 +433,19 @@
         },
         {
           "name": "get-position",
-          "description": "Accessor for deck.gl getPosition — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getPosition — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-fill-color",
-          "description": "Accessor for deck.gl getFillColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getFillColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-line-color",
-          "description": "Accessor for deck.gl getLineColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getLineColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-radius",
-          "description": "Accessor for deck.gl getRadius — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getRadius — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "radius",
@@ -526,7 +529,7 @@
         },
         {
           "name": "highlight-color",
-          "description": "Accessor for deck.gl highlightColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl highlightColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "radius-scale",
@@ -558,15 +561,15 @@
         },
         {
           "name": "get-line-width",
-          "description": "Accessor for deck.gl getLineWidth — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getLineWidth — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-pixel-offset",
-          "description": "Accessor for deck.gl getPixelOffset — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getPixelOffset — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-point-radius",
-          "description": "Accessor for deck.gl getPointRadius — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getPointRadius — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "point-radius-units",
@@ -578,7 +581,7 @@
         },
         {
           "name": "get-elevation",
-          "description": "Accessor for deck.gl getElevation — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getElevation — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "extruded",
@@ -638,23 +641,23 @@
         },
         {
           "name": "get-icon",
-          "description": "Accessor for deck.gl getIcon — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getIcon — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-icon-angle",
-          "description": "Accessor for deck.gl getIconAngle — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getIconAngle — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-icon-color",
-          "description": "Accessor for deck.gl getIconColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getIconColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-icon-pixel-offset",
-          "description": "Accessor for deck.gl getIconPixelOffset — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getIconPixelOffset — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-icon-size",
-          "description": "Accessor for deck.gl getIconSize — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getIconSize — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "text-size-max-pixels",
@@ -722,43 +725,43 @@
         },
         {
           "name": "get-text",
-          "description": "Accessor for deck.gl getText — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getText — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-angle",
-          "description": "Accessor for deck.gl getTextAngle — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextAngle — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-color",
-          "description": "Accessor for deck.gl getTextColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-pixel-offset",
-          "description": "Accessor for deck.gl getTextPixelOffset — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextPixelOffset — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-size",
-          "description": "Accessor for deck.gl getTextSize — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextSize — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-anchor",
-          "description": "Accessor for deck.gl getTextAnchor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextAnchor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-alignment-baseline",
-          "description": "Accessor for deck.gl getTextAlignmentBaseline — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextAlignmentBaseline — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-background-color",
-          "description": "Accessor for deck.gl getTextBackgroundColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextBackgroundColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-border-color",
-          "description": "Accessor for deck.gl getTextBorderColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextBorderColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-text-border-width",
-          "description": "Accessor for deck.gl getTextBorderWidth — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTextBorderWidth — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "line-joint-rounded",
@@ -790,7 +793,7 @@
         },
         {
           "name": "get-polygon",
-          "description": "Accessor for deck.gl getPolygon — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getPolygon — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "full3d",
@@ -798,15 +801,15 @@
         },
         {
           "name": "get-subtext",
-          "description": "Accessor for deck.gl getSubtext — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getSubtext — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-color",
-          "description": "Accessor for deck.gl getColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-size",
-          "description": "Accessor for deck.gl getSize — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getSize — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "layout",
@@ -826,15 +829,15 @@
         },
         {
           "name": "get-orientation",
-          "description": "Accessor for deck.gl getOrientation — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getOrientation — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-scale",
-          "description": "Accessor for deck.gl getScale — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getScale — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-translation",
-          "description": "Accessor for deck.gl getTranslation — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTranslation — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "size-scale",
@@ -854,7 +857,7 @@
         },
         {
           "name": "get-transform-matrix",
-          "description": "Accessor for deck.gl getTransformMatrix — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTransformMatrix — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "tileset",
@@ -878,7 +881,7 @@
         },
         {
           "name": "get-point-color",
-          "description": "Accessor for deck.gl getPointColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getPointColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "loader",
@@ -886,7 +889,55 @@
         },
         {
           "name": "src",
-          "description": "deck.gl geotiff."
+          "description": "deck.gl src."
+        },
+        {
+          "name": "georeference",
+          "description": "deck.gl georeference."
+        },
+        {
+          "name": "sensor-width-mm",
+          "description": "deck.gl sensorWidthMm."
+        },
+        {
+          "name": "sensor-height-mm",
+          "description": "deck.gl sensorHeightMm."
+        },
+        {
+          "name": "focal-length-mm",
+          "description": "deck.gl focalLengthMm."
+        },
+        {
+          "name": "bounds",
+          "description": "deck.gl bounds."
+        },
+        {
+          "name": "metadata",
+          "description": "deck.gl metadata."
+        },
+        {
+          "name": "depth-test",
+          "description": "deck.gl parameters.depthTest."
+        },
+        {
+          "name": "image",
+          "description": "deck.gl image."
+        },
+        {
+          "name": "desaturate",
+          "description": "deck.gl desaturate."
+        },
+        {
+          "name": "transparent-color",
+          "description": "deck.gl transparentColor."
+        },
+        {
+          "name": "tint-color",
+          "description": "deck.gl tintColor."
+        },
+        {
+          "name": "texture-parameters",
+          "description": "deck.gl textureParameters."
         },
         {
           "name": "min",
@@ -906,31 +957,31 @@
         },
         {
           "name": "get-source-position",
-          "description": "Accessor for deck.gl getSourcePosition — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getSourcePosition — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-target-position",
-          "description": "Accessor for deck.gl getTargetPosition — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTargetPosition — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-source-color",
-          "description": "Accessor for deck.gl getSourceColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getSourceColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-target-color",
-          "description": "Accessor for deck.gl getTargetColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTargetColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-width",
-          "description": "Accessor for deck.gl getWidth — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getWidth — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-height",
-          "description": "Accessor for deck.gl getHeight — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getHeight — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-tilt",
-          "description": "Accessor for deck.gl getTilt — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTilt — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "great-circle",
@@ -956,34 +1007,10 @@
           "name": "width-max-pixels",
           "description": "deck.gl widthMaxPixels."
         },
-        {
-          "name": "image",
-          "description": "deck.gl image."
-        },
-        {
-          "name": "bounds",
-          "description": "deck.gl bounds."
-        },
         {
           "name": "_image-coordinate-system",
           "description": "deck.gl _imageCoordinateSystem."
         },
-        {
-          "name": "desaturate",
-          "description": "deck.gl desaturate."
-        },
-        {
-          "name": "transparent-color",
-          "description": "deck.gl transparentColor."
-        },
-        {
-          "name": "tint-color",
-          "description": "deck.gl tintColor."
-        },
-        {
-          "name": "texture-parameters",
-          "description": "deck.gl textureParameters."
-        },
         {
           "name": "disk-resolution",
           "description": "deck.gl diskResolution."
@@ -1026,7 +1053,7 @@
         },
         {
           "name": "get-angle",
-          "description": "Accessor for deck.gl getAngle — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getAngle — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "joint-rounded",
@@ -1046,11 +1073,11 @@
         },
         {
           "name": "get-path",
-          "description": "Accessor for deck.gl getPath — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getPath — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-normal",
-          "description": "Accessor for deck.gl getNormal — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getNormal — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "_normalize",
@@ -1066,15 +1093,15 @@
         },
         {
           "name": "get-background-color",
-          "description": "Accessor for deck.gl getBackgroundColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getBackgroundColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-border-color",
-          "description": "Accessor for deck.gl getBorderColor — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getBorderColor — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-border-width",
-          "description": "Accessor for deck.gl getBorderWidth — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getBorderWidth — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "background-border-radius",
@@ -1134,23 +1161,23 @@
         },
         {
           "name": "get-alignment-baseline",
-          "description": "Accessor for deck.gl getAlignmentBaseline — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getAlignmentBaseline — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-content-box",
-          "description": "Accessor for deck.gl getContentBox — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getContentBox — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-pentagon",
-          "description": "Accessor for deck.gl getPentagon — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getPentagon — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-geohash",
-          "description": "Accessor for deck.gl getGeohash — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getGeohash — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-hexagons",
-          "description": "Accessor for deck.gl getHexagons — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getHexagons — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "high-precision",
@@ -1162,7 +1189,7 @@
         },
         {
           "name": "get-hexagon",
-          "description": "Accessor for deck.gl getHexagon — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getHexagon — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "extent",
@@ -1226,11 +1253,11 @@
         },
         {
           "name": "get-quadkey",
-          "description": "Accessor for deck.gl getQuadkey — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getQuadkey — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-s2-token",
-          "description": "Accessor for deck.gl getS2Token — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getS2Token — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "elevation-data",
@@ -1266,7 +1293,7 @@
         },
         {
           "name": "get-timestamps",
-          "description": "Accessor for deck.gl getTimestamps — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getTimestamps — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "grid-origin",
@@ -1274,7 +1301,7 @@
         },
         {
           "name": "get-weight",
-          "description": "Accessor for deck.gl getWeight — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getWeight — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "gpu-aggregation",
@@ -1302,11 +1329,11 @@
         },
         {
           "name": "get-color-value",
-          "description": "Accessor for deck.gl getColorValue — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getColorValue — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-color-weight",
-          "description": "Accessor for deck.gl getColorWeight — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getColorWeight — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "color-aggregation",
@@ -1334,11 +1361,11 @@
         },
         {
           "name": "get-elevation-value",
-          "description": "Accessor for deck.gl getElevationValue — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getElevationValue — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "get-elevation-weight",
-          "description": "Accessor for deck.gl getElevationWeight — expression language: $field, scale(), arithmetic."
+          "description": "Accessor for deck.gl getElevationWeight — expression language: $field, scale(), formatDate(), arithmetic."
         },
         {
           "name": "elevation-aggregation",
@@ -1769,6 +1796,40 @@
           "name": "field",
           "description": "Data field (filter / vega-lite widgets)."
         },
+        {
+          "name": "format",
+          "description": "Filter value-label format. Use date for epoch-millisecond fields; default number.",
+          "values": [
+            {
+              "name": "number"
+            },
+            {
+              "name": "date"
+            }
+          ]
+        },
+        {
+          "name": "date-style",
+          "description": "Filter date label style when format=\"date\".",
+          "values": [
+            {
+              "name": "date"
+            },
+            {
+              "name": "datetime"
+            },
+            {
+              "name": "time"
+            },
+            {
+              "name": "iso"
+            }
+          ]
+        },
+        {
+          "name": "time-zone",
+          "description": "Filter date label time zone when format=\"date\": UTC (default), local, or an IANA zone such as Asia/Singapore."
+        },
         {
           "name": "story",
           "description": "Story id (player widget)."

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nika-js/onlymap",
-  "version": "0.5.3",
+  "version": "0.5.7",
   "description": "Declarative deck.gl maps for HTML and React — interactive WebGL mapping with GeoJSON/CSV/Arrow data, MapLibre basemaps, widgets, popups, and live streams from a custom-element manifest or typed React components. TypeScript, no build step.",
   "license": "SEE LICENSE IN LICENSE.md",
   "publishConfig": {
@@ -150,8 +150,12 @@
     "d3-color": "^3.1.0",
     "d3-interpolate": "^3.0.1",
     "d3-scale": "^4.0.2",
+    "exifr": "^7.1.3",
+    "flatgeobuf": "^4.4.0",
     "fzstd": "^0.1.1",
     "happy-dom": "^20.10.6",
+    "hyparquet": "^1.27.1",
+    "hyparquet-compressors": "^1.1.1",
     "jotai": "^2.20.2",
     "maplibre-gl": "^5.24.0",
     "mobx": "^6.16.1",

package/skills/onlymapjs/SKILL.md

@@ -23,7 +23,7 @@ Use OnlyMapJS as a declarative HTML map library. Write custom elements such as `
 </script>
 ```
 
-For no-build CDN pages, use the single-file standalone bundle from a raw-file CDN — `https://unpkg.com/@nika-js/onlymap@0.5.3` (the bare package URL serves `dist/onlymap.standalone.js`) — plus `<link rel="stylesheet" href="https://unpkg.com/@nika-js/onlymap@0.5.3/dist/onlymapjs.css">`. Never a rebundling CDN (esm.sh, skypack): re-bundling duplicates the deck.gl/luma.gl runtime and every layer fails shader compilation.
+For no-build CDN pages, use the single-file standalone bundle from a raw-file CDN — `https://unpkg.com/@nika-js/onlymap@0.5.7` (the bare package URL serves `dist/onlymap.standalone.js`) — plus `<link rel="stylesheet" href="https://unpkg.com/@nika-js/onlymap@0.5.7/dist/onlymapjs.css">`. Never a rebundling CDN (esm.sh, skypack): re-bundling duplicates the deck.gl/luma.gl runtime and every layer fails shader compilation.
 
 ## React Projects
 
@@ -52,6 +52,8 @@ Load the smallest reference needed for the task:
 - Attribute names are kebab-case: `get-fill-color`, `radius-units`, `line-width-min-pixels`.
 - Accessor values are expressions: `get-position="[$lon, $lat]"`.
 - `scale()` always needs an explicit `domain=`.
+- Format epoch-millisecond or ISO fields with the safe `formatDate()` built-in, e.g. `get-text="formatDate($time, 'datetime', 'UTC')"`. Do not use `new Date()`, `Intl`, or method calls in restricted expressions.
+- For a built-in filter over epoch milliseconds, add `format="date"` with optional `date-style="date|datetime|time|iso"` and `time-zone="UTC|local|<IANA zone>"`; do not hand-roll a time slider only to format its labels.
 - ScatterplotLayer points need an explicit size — `radius="6" radius-units="pixels"`, `get-radius="..."`, or `radius-min-pixels="..."`: deck's default is 1 METER, sub-pixel at city zooms, and validation warns on layers with no radius source.
 - Prefer canonical color expressions — a `sequential`/`diverging`/`threshold` `scale()` or an equality ternary chain — over hand-rolled arithmetic: the legend widget parses these shapes and renders a matching gradient ramp / class ranges / category palette automatically.
 - Inline handlers such as `onclick` are wrong. Use `data-emit`, `<om-behavior>`, or widget scripts.
@@ -70,6 +72,7 @@ Load the smallest reference needed for the task:
 - Keep mobile chrome usable -> rely on the default map-width auto-fold into per-side drawers; mark only essential controls `fold="never"`. Use `widgets-fold="off"` only when the user explicitly wants fixed wide-layout chrome.
 - Group adjacent map buttons (zoom + undo + toggle into one control group) -> just place compact button widgets in the same `position` slot; they auto-cluster. `cluster="false"` opts one out. Do NOT build a wrapper widget.
 - GeoTIFF/COG raster (DEM, satellite imagery, NDVI) -> `<om-layer type="COGLayer" src="…tif">` with `min`/`max`/`colormap` for single-band data (see syntax.md — `src`, not `data`).
+- Geotagged drone JPEG -> `<om-layer type="ImageOverlay" src="…jpg" georeference="exif">`; for saved/collaborative maps persist the processed image and reconstruct with explicit `bounds` (see syntax.md; this is visualization-grade, not orthorectification).
 - CityJSON/CityJSONSeq per-face surfaces mode (`?om-surfaces=1`) -> always pair the `SolidPolygonLayer` with a companion `<om-layer type="PathLayer">` using `get-path="$outline"` to make roof/wall edges visible. This mode is unlit and `SolidPolygonLayer`'s own `wireframe` prop does nothing here (deck only builds wireframe geometry when `extruded: true`); the `PathLayer` is the only way to see face edges. Give it the same `filter-field`/`filter-range` as the fill layer so filtered-out buildings' outlines disappear too. See syntax.md.
 - Live entity updates -> `wss://` stream with `key` and optional `source` decoder.
 - REST snapshot that changes over time -> `refresh="5s"`.