ixmaps-gl 0.2.21 → 0.2.22

package/README.md

@@ -286,7 +286,7 @@ of your own project files gl can render.
 Load the engine from jsDelivr, pinned to a release tag (or `@main` for the latest commit):
 
 ```html
-<script src="https://cdn.jsdelivr.net/gh/gjrichter/ixmaps-gl@v0.2.21/ixmaps-gl.js"></script>
+<script src="https://cdn.jsdelivr.net/gh/gjrichter/ixmaps-gl@v0.2.22/ixmaps-gl.js"></script>
 ```
 
 or from unpkg, the npm package [`ixmaps-gl`](https://www.npmjs.com/package/ixmaps-gl)
@@ -294,13 +294,13 @@ or from unpkg, the npm package [`ixmaps-gl`](https://www.npmjs.com/package/ixmap
 browser script, which defines the global `ixmaps`):
 
 ```html
-<script src="https://unpkg.com/ixmaps-gl@0.2.21/ixmaps-gl.js"></script>
+<script src="https://unpkg.com/ixmaps-gl@0.2.22/ixmaps-gl.js"></script>
 ```
 
 or use a local copy (`<script src="ixmaps-gl.js"></script>`). A minimal page:
 
 ```html
-<script src="https://cdn.jsdelivr.net/gh/gjrichter/ixmaps-gl@v0.2.21/ixmaps-gl.js"></script>
+<script src="https://cdn.jsdelivr.net/gh/gjrichter/ixmaps-gl@v0.2.22/ixmaps-gl.js"></script>
 <div id="map_div" style="position:absolute;inset:0;"></div>
 
 <script>

package/ixmaps-gl.js

@@ -96,7 +96,7 @@
   // ---------------------------------------------------------------
   // this engine's release (= package.json "version", checked by
   // test/unit/version.test.mjs); ixmaps.glVersion, and logged once at start
-  const IXMAPS_GL_VERSION = '0.2.21';
+  const IXMAPS_GL_VERSION = '0.2.22';
 
   const LIB_URLS = {
     // Bumped 3.6.2 -> 5.x (2026-09-21, globe-projection compat fix): native
@@ -1542,6 +1542,16 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
     _filterCache.set(expr, pred);
     return pred;
   }
+  // a load-time .filter() drops records for good, so a later changeThemeStyle
+  // "filter" must re-filter the unfiltered data (flat re-processes the theme
+  // with the new filter) instead of narrowing what the first filter left
+  function refilterFrom(raw, spec, runtimes) {
+    return expr => {
+      const f = applyWhereFilter(raw, expr);
+      return f.type === 'Table' ? joinTableFeatures(spec, f, runtimes) : f;
+    };
+  }
+
   function applyWhereFilter(fc, filterExpr) {
     if (!filterExpr) return fc;
     const pred = flatFilterPredicate(String(filterExpr));
@@ -2226,6 +2236,19 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
   // build()'s main loop and defineLayer(), the two places a runtime is
   // ever created, for where this gets populated.
   const _globalThemeRegistry = new Map();
+  // flat's theme index (maptheme.js getTheme, "theme 0,1,2,..."): a number or
+  // numeric string below the theme count addresses the n-th theme
+  function isThemeIndex(id, count) {
+    return id != null && id !== '' && typeof id !== 'boolean' && !isNaN(Number(id)) && Number.isInteger(Number(id)) && Number(id) >= 0 && Number(id) < count;
+  }
+  // the runtime of a theme id for the module-level globals: by name, else the
+  // n-th theme of the last built map
+  function registryTheme(id) {
+    const rt = _globalThemeRegistry.get(id);
+    if (rt) return rt;
+    const list = _lastMapApi && _lastMapApi.runtimes;
+    return list && isThemeIndex(id, list.length) ? list[Number(id)] : undefined;
+  }
 
   // Same LAST-DEFINITION-WINS rationale as _globalThemeRegistry above, for
   // real ixmaps-flat's map-LEVEL globals (ixmaps.getProjectString/
@@ -3762,7 +3785,10 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
       };
       // a plain FEATURE(S) base layer has one flat fill (no classes); FEATURE|CATEGORICAL
       // is coloured per category (see _buildFeaturesLayers), so it gets a legend
-      const legendApplies = rt => rt.categoryLabels && rt.categoryLabels.length
+      // a CATEGORICAL theme with no value binding (a count per aggregation cell) has no
+      // category rows: its panel is the text legend (title / snippet / description)
+      const countOnlyLegend = rt => !rt.categoryLabels && rt.flags.has('CATEGORICAL') && !rt.binding.value;
+      const legendApplies = rt => (countOnlyLegend(rt) || (rt.categoryLabels && rt.categoryLabels.length))
         && (!(rt.flags.has('FEATURE') || rt.flags.has('FEATURES')) || rt.flags.has('CATEGORICAL')) && !rt.flags.has('NOLEGEND');
       // One theme's panel — at build time for every theme, and again for a
       // theme defined later (map.layer(...) in a myMap.then(...) chain,
@@ -3898,7 +3924,7 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
           // dropdown and Chart-size slider stay: neither is a
           // "categorical item" or "colorscheme swatch", both are
           // independent controls unrelated to the row list.
-          const isTextOnly = rt.flags.has('TEXTLEGEND');
+          const isTextOnly = rt.flags.has('TEXTLEGEND') || countOnlyLegend(rt);
 
           // Map-view-aware per explicit request: totals reflect only
           // what's CURRENTLY on screen (the map's own bounds, plus the
@@ -4577,6 +4603,7 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
         const filtered = applyWhereFilter(raw, spec.filter);
         const fc = filtered.type === 'Table' ? joinTableFeatures(spec, filtered, runtimes) : filtered;
         const rt = new LayerRuntime(spec, fc, this._engineOptions);
+        if (spec.filter) rt._refilter = refilterFrom(raw, spec, runtimes);
         // tags which underlying data source this runtime came from — see
         // setFacetFilter/clearFacetFilter/clearAllFacetFilters below,
         // which use this to propagate a facet filter to every theme
@@ -4805,6 +4832,9 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
       // verified conventions' own priority (layer name, then style.name).
       function findRuntime(themeId) {
         const matches = runtimes.filter(r => r.name === themeId || (r.style && r.style.name === themeId) || (r.meta && r.meta.name === themeId));
+        // a number (or "1", "2" ...) naming no theme is flat's theme index
+        // (maptheme.js getTheme): 0-based, base layers counted
+        if (!matches.length && isThemeIndex(themeId, runtimes.length)) return runtimes[Number(themeId)];
         if (!matches.length) { console.warn(`[ixmaps-gl] no layer named "${themeId}"`); return undefined; }
         return matches.find(r => !r.flags.has('FEATURE') && !r.flags.has('FEATURES')) || matches[0];
       }
@@ -5087,7 +5117,13 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
           targets.forEach(rt => {
             if (validation) validation.style(themeIdOf(rt), { [key]: value });
             if (key === 'filter') {
-              rt.setRuntimeFilter(action === 'remove' ? '' : value);
+              const expr = action === 'remove' ? '' : value;
+              if (rt._refilter) {
+                // the theme was loaded with a filter: re-filter its full data
+                rt._runtimeFilterExpr = '';
+                rt._filterExpr = expr;
+                rt.replaceFeatures(rt._refilter(expr));
+              } else rt.setRuntimeFilter(expr);
               changed = true;
               return;
             }
@@ -5425,6 +5461,7 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
           spec = pspec;
         }
         rt.replaceFeatures(namedThemeFeatures(spec, rows, rt._specBinding));
+        rt._refilter = spec.filter ? expr => namedThemeFeatures(Object.assign({}, spec, { filter: expr }), rows, rt._specBinding) : null;
         if (glDebug()) console.info(`[ixmaps-gl debug] data for ${themeIdOf(rt)}: ${rows.length} rows → ${rt.features.length} features`);
         // the legend is built from the theme's classes: build it again
         if (rt._legendPanel && rt._legendPanel.parentNode) rt._legendPanel.parentNode.removeChild(rt._legendPanel);
@@ -5500,6 +5537,7 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
         const filtered = applyWhereFilter(raw, spec.filter);
         const fc = filtered.type === 'Table' ? joinTableFeatures(spec, filtered, runtimes) : filtered;
         const rt = new LayerRuntime(spec, fc, builder._engineOptions);
+        if (spec.filter) rt._refilter = refilterFrom(raw, spec, runtimes);
         rt._definition = pdef; // for refreshTheme
         rt._deferredLoad = deferred;
         rt._named = named;
@@ -10853,7 +10891,14 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
     // reasonable rather than wrong.
     // borderOpacity (default 1): the border's own alpha (flat's
     // stroke-opacity, see flatBubbleLook)
+    // colorscheme ["none"] — flat's explicit no-fill symbol
+    _noFillScheme() {
+      const cs = this.style.colorscheme;
+      return Array.isArray(cs) && cs.length === 1 && String(cs[0]).trim().toLowerCase() === 'none';
+    }
+
     _buildSingleIcon(colorRgb, opacity, shape, borderColorRgb, borderWidth, borderOpacity = 1) {
+      if (!colorRgb) { colorRgb = [128, 128, 128]; opacity = 0; } // no class colour (["none"]): unfilled
       shape = shape || 'circle';
       borderWidth = borderWidth || 0;
       const key = `single-${shape}-${colorRgb.join(',')}-${opacity}-${borderColorRgb ? borderColorRgb.join(',') : 'none'}-${borderWidth}${borderOpacity !== 1 ? `-so${borderOpacity}` : ''}`;
@@ -12905,6 +12950,15 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
       // _buildTooltipContext's own `isGroup` check already uses).
       const sizeValueOf = d => d.properties.counts ? d.properties.total : d.properties.value;
       const combined = individual.concat(groups).sort((a, b) => sizeValueOf(a) - sizeValueOf(b));
+      // .style({minvalue}) on a bubble: flat skips an item whose size value is below it
+      // (maptheme.js 19826 / 20698, `this.nMinValue && nSizeValue < this.nMinValue`).
+      // combined is ascending, so the items below it are a prefix.
+      const bubbleMin = this.flags.has('SYMBOL') ? styleNum(this.style.minvalue) : NaN;
+      if (bubbleMin) {
+        let cut = 0;
+        while (cut < combined.length && sizeValueOf(combined[cut]) < bubbleMin) cut++;
+        combined.splice(0, cut);
+      }
       // maxcharts: like the flat engine (maptheme.js nMaxCharts), draw only the
       // biggest N items — combined is ascending, so drop from the front
       applyFlatMaxCharts(combined, this.style);
@@ -13239,6 +13293,8 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
         // a CATEGORICAL BUBBLE: flat's look (flatBubbleLook) in screen px,
         // its stroke centered on the radius as flat's SVG circle
         const lookUnit = objectZoomFactor(liveZoom, this.mapOptions) * (styleNum(this.style.scale) || 1);
+        // colorscheme ["none"]: flat draws the symbol unfilled (only its values / box / title)
+        const noFill = this._noFillScheme();
         const circleLook = flatLook ? d => flatBubbleLook((this.categoryColorsRgb || [])[d.properties.cat] || [128, 128, 128], radiusPx(d), lookUnit, this.style, this.flags) : null;
         const lineRgb = d => (circleLook ? circleLook(d).stroke : outlineRgb(d)) || [0, 0, 0];
         layers.push(new ScatterplotLayer({
@@ -13247,7 +13303,7 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
           getPosition: d => d.geometry.coordinates,
           getRadius: d => radiusPx(d) - (symbolOutline || circleLook ? 0 : outlinePx(d, radiusPx(d)) / 2),
           radiusUnits: 'pixels',
-          getFillColor: d => [...((this.categoryColorsRgb || [])[d.properties.cat] || [128, 128, 128]).slice(0, 3), Math.round(this._iconAlpha(d) * (circleLook ? circleLook(d).fillOpacity : fillOpacity))],
+          getFillColor: d => [...((this.categoryColorsRgb || [])[d.properties.cat] || [128, 128, 128]).slice(0, 3), noFill ? 0 : Math.round(this._iconAlpha(d) * (circleLook ? circleLook(d).fillOpacity : fillOpacity))],
           stroked: circleLook ? combined.some(d => circleLook(d).stroke) : combined.some(d => outlineRgb(d)),
           getLineColor: d => [...lineRgb(d).slice(0, 3), Math.round(this._iconAlpha(d) * (circleLook ? circleLook(d).strokeOpacity : 1))],
           getLineWidth: d => (circleLook ? (circleLook(d).stroke ? circleLook(d).width : 0) : outlinePx(d, radiusPx(d))),
@@ -14957,7 +15013,8 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
     }
 
     // pure: oneHot → see the pure-function sections above the class
-    _oneHot(cat, value) { return oneHot(cat, value, this.categoryLabels.length); }
+    // CATEGORICAL without a value binding (count per aggregation cell) has no categoryLabels: one bucket
+    _oneHot(cat, value) { return oneHot(cat, value, this.categoryLabels ? this.categoryLabels.length : 1); }
 
     // pure: groupCoLocated → see the pure-function sections above the class
     _groupCoLocated(clusterFeatures, zoom) { return groupCoLocated(clusterFeatures, zoom, this._clusterRadiusPx, this.categoryLabels ? this.categoryLabels.length : 1, this.flags); }
@@ -15183,7 +15240,7 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
     show() { mapHandle(this.szMap).setThemeVisible(this.szTheme, true); return this; },
     hide() { mapHandle(this.szMap).setThemeVisible(this.szTheme, false); return this; },
     toggle() {
-      const rt = _globalThemeRegistry.get(this.szTheme);
+      const rt = registryTheme(this.szTheme);
       mapHandle(this.szMap).setThemeVisible(this.szTheme, rt ? !!rt._hidden : false);
       return this;
     },
@@ -15350,7 +15407,7 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
     // no id: flat's current theme — here the one a page's facets were
     // built for (its own facet script sets ixmaps.filterThemeId), else the
     // last chart / choropleth theme
-    let rt = szId != null ? _globalThemeRegistry.get(szId) : null;
+    let rt = szId != null ? registryTheme(szId) : null;
     if (szId == null) {
       const pid = pageIxmaps() && pageIxmaps().filterThemeId;
       rt = (pid != null && _globalThemeRegistry.get(pid))
@@ -15441,7 +15498,7 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
   // flat's ixmaps.getThemeDefinitionObj(szId): the theme's definition —
   // type, style (sizefield/valuefield as flat names them), meta
   function getThemeDefinitionObj(szId) {
-    const rt = _globalThemeRegistry.get(szId);
+    const rt = registryTheme(szId);
     if (!rt) return null;
     const style = Object.assign({}, rt.style);
     if (rt.binding.size && !style.sizefield) style.sizefield = rt.binding.size;
@@ -15487,11 +15544,11 @@ float barSegDist(vec2 p, vec2 a, vec2 b) {
   // before that block ran (there is none, currently) would just no-op
   // here instead of redrawing.
   function markThemeClass(szId, index) {
-    const rt = _globalThemeRegistry.get(szId);
+    const rt = registryTheme(szId);
     if (rt) markRuntimeClass(rt, index);
   }
   function unmarkThemeClass(szId, index) {
-    const rt = _globalThemeRegistry.get(szId);
+    const rt = registryTheme(szId);
     if (rt) unmarkRuntimeClass(rt, index);
   }
   // the legend's own rows mark their theme directly: its .layer() name

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "ixmaps-gl",
-  "version": "0.2.21",
+  "version": "0.2.22",
   "description": "MapLibre GL + deck.gl reimplementation of the ixmaps-flat declarative mapping engine",
   "main": "ixmaps-gl.js",
   "browser": "ixmaps-gl.js",