@vitessce/gl 3.1.2 → 3.2.0

package/dist/index.js

@@ -1,33 +1,34 @@
-import { f as distEs6 } from "./index-72755d2f.js";
-import { n, m, A, q, p, o, i, C, k, D, G, e, H, c, M, j, l, d, P, S, h, T, s, b, r, v } from "./index-72755d2f.js";
+import { f as distEs6 } from "./index-2a7f1ae0.js";
+import { o, n, A, r, q, p, i, j, C, l, D, G, e, H, c, M, k, m, d, P, S, h, T, t, b, s, v } from "./index-2a7f1ae0.js";
 import "react";
 const SELECTION_TYPE = distEs6.SELECTION_TYPE;
 export {
-  n as AXIS_FONT_FAMILY,
-  m as AXIS_LABEL_TEXT_SIZE,
+  o as AXIS_FONT_FAMILY,
+  n as AXIS_LABEL_TEXT_SIZE,
   A as AXIS_MARGIN,
-  q as AXIS_MAX_SIZE,
-  p as AXIS_MIN_SIZE,
-  o as AXIS_PADDING,
+  r as AXIS_MAX_SIZE,
+  q as AXIS_MIN_SIZE,
+  p as AXIS_PADDING,
   i as BitmaskLayer,
+  j as BitmaskLayerBeta,
   C as COLOR_BAR_SIZE,
-  k as DATA_TEXTURE_SIZE,
+  l as DATA_TEXTURE_SIZE,
   D as DEFAULT_GL_OPTIONS,
   G as GLSL_COLORMAPS,
   e as GLSL_COLORMAP_DEFAULT,
   H as HeatmapBitmapLayer,
   c as HeatmapCompositeTextLayer,
   M as MAX_ROW_AGG,
-  j as MIN_ROW_AGG,
-  l as PIXELATED_TEXTURE_PARAMETERS,
+  k as MIN_ROW_AGG,
+  m as PIXELATED_TEXTURE_PARAMETERS,
   d as PaddedExpressionHeatmapBitmapLayer,
   P as PixelatedBitmapLayer,
   SELECTION_TYPE,
   S as ScaledExpressionExtension,
   h as SelectionExtension,
   T as TILE_SIZE,
-  s as deck,
-  b as getSelectionLayers,
-  r as luma,
+  t as deck,
+  b as getSelectionLayer,
+  s as luma,
   v as viv
 };

package/dist/{jpeg-cb74431a.js → jpeg-95f78026.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-72755d2f.js";
+import { B as BaseDecoder } from "./index-2a7f1ae0.js";
 import "react";
 const dctZigZag = new Int32Array([
   0,

package/dist/{lerc-5dffa929.js → lerc-5320d7fa.js}

@@ -1,5 +1,5 @@
 import { i as inflate_1 } from "./pako.esm-68f84e2a.js";
-import { g as getDefaultExportFromCjs, B as BaseDecoder, L as LercParameters, a as LercAddCompression } from "./index-72755d2f.js";
+import { g as getDefaultExportFromCjs, B as BaseDecoder, L as LercParameters, a as LercAddCompression } from "./index-2a7f1ae0.js";
 import "react";
 var LercDecode = { exports: {} };
 (function(module) {

package/dist/{lzw-85fa08a9.js → lzw-8d3691e0.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-72755d2f.js";
+import { B as BaseDecoder } from "./index-2a7f1ae0.js";
 import "react";
 const MIN_BITS = 9;
 const CLEAR_CODE = 256;

package/dist/{packbits-6b8314bf.js → packbits-2846ed6b.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-72755d2f.js";
+import { B as BaseDecoder } from "./index-2a7f1ae0.js";
 import "react";
 class PackbitsDecoder extends BaseDecoder {
   decodeBlock(buffer) {

package/dist/{raw-f12c17bf.js → raw-b0ec4406.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-72755d2f.js";
+import { B as BaseDecoder } from "./index-2a7f1ae0.js";
 import "react";
 class RawDecoder extends BaseDecoder {
   decodeBlock(buffer) {

package/dist/{webimage-99c1b585.js → webimage-a17e81f9.js}

@@ -1,4 +1,4 @@
-import { B as BaseDecoder } from "./index-72755d2f.js";
+import { B as BaseDecoder } from "./index-2a7f1ae0.js";
 import "react";
 class WebImageDecoder extends BaseDecoder {
   constructor() {

package/dist-tsc/BitmaskLayerBeta.d.ts

@@ -0,0 +1,152 @@
+declare const BitmaskLayer_base: new (...props: import(".pnpm/@vivjs+types@0.13.7/node_modules/@vivjs/types").Viv<{
+    contrastLimits: number[][];
+    channelsVisible: boolean[];
+    dtype: string;
+    domain?: number[] | undefined;
+    id?: string | undefined;
+    onHover?: Function | undefined;
+    onClick?: Function | undefined;
+    modelMatrix?: Object | undefined;
+    interpolation?: number | undefined;
+}, string[]>[]) => any;
+/**
+ * A BitmapLayer that performs aggregation in the fragment shader,
+ * and renders its texture from a Uint8Array rather than an ImageData.
+ */
+declare class BitmaskLayer extends BitmaskLayer_base {
+    [x: string]: any;
+    getShaders(): {
+        fs: string;
+        vs: string;
+        modules: any[];
+        defines: {
+            COLORMAP_FUNC: any;
+        };
+    };
+    /**
+     * Override the parent loadChannelTextures to enable
+     * up to eight channels (rather than six).
+     * Reference: https://github.com/hms-dbmi/viv/blob/v0.13.3/packages/layers/src/xr-layer/xr-layer.js#L316
+    */
+    loadChannelTextures(channelData: any): void;
+    updateState({ props, oldProps, changeFlags }: {
+        props: any;
+        oldProps: any;
+        changeFlags: any;
+    }): void;
+    draw(opts: any): void;
+    /**
+     * This function creates textures from the data
+     */
+    dataToTexture(data: any, width: any, height: any): any;
+    multiSetsToTexture(multiFeatureValues: any, setColorValues: any, channelIsSetColorMode: any): any[];
+}
+declare namespace BitmaskLayer {
+    export const layerName: string;
+    export { defaultProps };
+}
+export default BitmaskLayer;
+declare namespace defaultProps {
+    namespace channelStrokeWidths {
+        const type: string;
+        const value: null;
+        const compare: boolean;
+    }
+    namespace channelsFilled {
+        const type_1: string;
+        export { type_1 as type };
+        const value_1: null;
+        export { value_1 as value };
+        const compare_1: boolean;
+        export { compare_1 as compare };
+    }
+    namespace channelOpacities {
+        const type_2: string;
+        export { type_2 as type };
+        const value_2: null;
+        export { value_2 as value };
+        const compare_2: boolean;
+        export { compare_2 as compare };
+    }
+    namespace channelColors {
+        const type_3: string;
+        export { type_3 as type };
+        const value_3: null;
+        export { value_3 as value };
+        const compare_3: boolean;
+        export { compare_3 as compare };
+    }
+    namespace hoveredCell {
+        const type_4: string;
+        export { type_4 as type };
+        const value_4: null;
+        export { value_4 as value };
+        const compare_4: boolean;
+        export { compare_4 as compare };
+    }
+    namespace colormap {
+        const type_5: string;
+        export { type_5 as type };
+        export { GLSL_COLORMAP_DEFAULT as value };
+        const compare_5: boolean;
+        export { compare_5 as compare };
+    }
+    namespace expressionData {
+        const type_6: string;
+        export { type_6 as type };
+        const value_5: null;
+        export { value_5 as value };
+        const compare_6: boolean;
+        export { compare_6 as compare };
+    }
+    namespace multiFeatureValues {
+        const type_7: string;
+        export { type_7 as type };
+        const value_6: null;
+        export { value_6 as value };
+        const compare_7: boolean;
+        export { compare_7 as compare };
+    }
+    namespace setColorValues {
+        const type_8: string;
+        export { type_8 as type };
+        const value_7: null;
+        export { value_7 as value };
+        const compare_8: boolean;
+        export { compare_8 as compare };
+    }
+    namespace channelFeatureValueColormaps {
+        const type_9: string;
+        export { type_9 as type };
+        const value_8: null;
+        export { value_8 as value };
+        const compare_9: boolean;
+        export { compare_9 as compare };
+    }
+    namespace channelFeatureValueColormapRanges {
+        const type_10: string;
+        export { type_10 as type };
+        const value_9: null;
+        export { value_9 as value };
+        const compare_10: boolean;
+        export { compare_10 as compare };
+    }
+    namespace channelIsStaticColorMode {
+        const type_11: string;
+        export { type_11 as type };
+        const value_10: null;
+        export { value_10 as value };
+        const compare_11: boolean;
+        export { compare_11 as compare };
+    }
+    namespace channelIsSetColorMode {
+        const type_12: string;
+        export { type_12 as type };
+        const value_11: null;
+        export { value_11 as value };
+        const compare_12: boolean;
+        export { compare_12 as compare };
+    }
+}
+import { GLSL_COLORMAP_DEFAULT } from "./constants.js";
+//# sourceMappingURL=BitmaskLayerBeta.d.ts.map

package/dist-tsc/BitmaskLayerBeta.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BitmaskLayerBeta.d.ts","sourceRoot":"","sources":["../src/BitmaskLayerBeta.js"],"names":[],"mappings":";;;;;;;;;;;AAgDA;;;GAGG;AACH;;IAEE;;;;;;;MAYC;IAED;;;;MAIE;IACF,4CA0BC;IAED;;;;aAyCC;IAED,sBAuHC;IAED;;OAEG;IACH,uDAqBC;IAED,oGAiEC;CACF"}

package/dist-tsc/BitmaskLayerBeta.js

@@ -0,0 +1,253 @@
+/* eslint-disable no-unused-vars */
+import GL from '@luma.gl/constants'; // eslint-disable-line import/no-extraneous-dependencies
+import { project32, picking } from '@deck.gl/core'; // eslint-disable-line import/no-extraneous-dependencies
+import { Texture2D, isWebGL2 } from '@luma.gl/core';
+import { XRLayer } from '@hms-dbmi/viv';
+import { fromEntries } from '@vitessce/utils';
+import { range } from 'lodash-es';
+import { fs, vs } from './bitmask-layer-beta-shaders.js';
+import { GLSL_COLORMAPS, GLSL_COLORMAP_DEFAULT, COLORMAP_SHADER_PLACEHOLDER, } from './constants.js';
+import { multiSetsToTextureData } from './bitmask-utils.js';
+const MAX_CHANNELS = 7;
+const MULTI_FEATURE_TEX_SIZE = 2048;
+function padWithDefault(arr, defaultValue, padWidth) {
+    const newArr = [...arr];
+    for (let i = 0; i < padWidth; i += 1) {
+        newArr.push(defaultValue);
+    }
+    return newArr;
+}
+function getColor(arr) {
+    return arr ? arr.map(v => v / 255) : [0, 0, 0];
+}
+const defaultProps = {
+    channelStrokeWidths: { type: 'array', value: null, compare: true },
+    channelsFilled: { type: 'array', value: null, compare: true },
+    channelOpacities: { type: 'array', value: null, compare: true },
+    channelColors: { type: 'array', value: null, compare: true },
+    hoveredCell: { type: 'number', value: null, compare: true },
+    colormap: { type: 'string', value: GLSL_COLORMAP_DEFAULT, compare: true },
+    expressionData: { type: 'object', value: null, compare: true },
+    multiFeatureValues: { type: 'array', value: null, compare: true },
+    setColorValues: { type: 'array', value: null, compare: true },
+    channelFeatureValueColormaps: { type: 'array', value: null, compare: true },
+    channelFeatureValueColormapRanges: { type: 'array', value: null, compare: true },
+    channelIsStaticColorMode: { type: 'array', value: null, compare: true },
+    channelIsSetColorMode: { type: 'array', value: null, compare: true },
+};
+/**
+ * A BitmapLayer that performs aggregation in the fragment shader,
+ * and renders its texture from a Uint8Array rather than an ImageData.
+ */
+export default class BitmaskLayer extends XRLayer {
+    // eslint-disable-next-line class-methods-use-this
+    getShaders() {
+        const { colormap } = this.props;
+        return {
+            fs,
+            vs,
+            modules: [project32, picking],
+            defines: {
+                [COLORMAP_SHADER_PLACEHOLDER]: GLSL_COLORMAPS.includes(colormap)
+                    ? colormap
+                    : GLSL_COLORMAP_DEFAULT,
+            },
+        };
+    }
+    /**
+     * Override the parent loadChannelTextures to enable
+     * up to eight channels (rather than six).
+     * Reference: https://github.com/hms-dbmi/viv/blob/v0.13.3/packages/layers/src/xr-layer/xr-layer.js#L316
+    */
+    loadChannelTextures(channelData) {
+        const textures = {
+            channel0: null,
+            channel1: null,
+            channel2: null,
+            channel3: null,
+            channel4: null,
+            channel5: null,
+            channel6: null,
+        };
+        if (this.state.textures) {
+            Object.values(this.state.textures).forEach(tex => tex && tex.delete());
+        }
+        if (channelData
+            && Object.keys(channelData).length > 0
+            && channelData.data) {
+            channelData.data.forEach((d, i) => {
+                textures[`channel${i}`] = this.dataToTexture(d, channelData.width, channelData.height);
+            }, this);
+            this.setState({ textures });
+        }
+    }
+    updateState({ props, oldProps, changeFlags }) {
+        super.updateState({ props, oldProps, changeFlags });
+        if (props.multiFeatureValues !== oldProps.multiFeatureValues
+            || props.setColorValues !== oldProps.setColorValues
+            || props.channelIsSetColorMode !== oldProps.channelIsSetColorMode) {
+            const { multiFeatureValues, setColorValues, channelIsSetColorMode } = this.props;
+            // Use one expressionTex for all channels,
+            // using an offset mechanism.
+            const [valueTex, colorTex, valueTexOffsets, colorTexOffsets, valueTexHeight, colorTexHeight,] = this.multiSetsToTexture(multiFeatureValues, setColorValues, channelIsSetColorMode);
+            this.setState({
+                valueTex,
+                colorTex,
+                valueTexOffsets,
+                colorTexOffsets,
+                valueTexHeight,
+                colorTexHeight,
+            });
+        }
+        if (props.colormap !== oldProps.colormap) {
+            const { gl } = this.context;
+            if (this.state.model) {
+                this.state.model.delete();
+            }
+            // eslint-disable-next-line no-underscore-dangle
+            this.setState({ model: this._getModel(gl) });
+            this.getAttributeManager().invalidateAll();
+        }
+    }
+    draw(opts) {
+        const { uniforms } = opts;
+        const { channelStrokeWidths, channelsFilled, channelOpacities, channelColors, channelsVisible, 
+        // TODO: use `channelFeatureValueColormaps` in shader,
+        // figure out how to call multiple GLSL colormap functions
+        channelFeatureValueColormaps, channelFeatureValueColormapRanges, channelIsStaticColorMode, channelIsSetColorMode, hoveredCell, colorScaleLo, colorScaleHi, isExpressionMode, zoom, minZoom, maxZoom, zoomOffset, // TODO: figure out if this needs to be used or not
+         } = this.props;
+        const { textures, model, 
+        // Expression and set index (and colors) textures with offsets
+        valueTex, colorTex, valueTexOffsets, colorTexOffsets, valueTexHeight, colorTexHeight, } = this.state;
+        // Render the image
+        if (textures && model) {
+            const scaleFactor = 1 / (2 ** (maxZoom - zoom));
+            const colors = fromEntries(range(MAX_CHANNELS).map(i => ([`color${i}`, getColor(channelColors[i])])));
+            model
+                .setUniforms(Object.assign({}, uniforms, {
+                ...colors,
+                // Bitmask image channel data textures
+                ...textures,
+                multiFeatureTexSize: MULTI_FEATURE_TEX_SIZE,
+                // Expression textures with offsets
+                valueTex,
+                valueTexOffsets: padWithDefault(valueTexOffsets, 0, MAX_CHANNELS - valueTexOffsets.length),
+                valueTexHeight,
+                // Set indices and colors textures with offsets
+                colorTex,
+                colorTexOffsets: padWithDefault(colorTexOffsets, 0, MAX_CHANNELS - colorTexOffsets.length),
+                colorTexHeight,
+                // Visualization properties
+                channelsFilled: padWithDefault(channelsFilled, true, 
+                // There are six texture entries on the shaders
+                MAX_CHANNELS - channelsFilled.length),
+                channelOpacities: padWithDefault(channelOpacities, 0.0, 
+                // There are six texture entries on the shaders
+                MAX_CHANNELS - channelOpacities.length),
+                channelStrokeWidths: padWithDefault(channelStrokeWidths, 1.0, 
+                // There are six texture entries on the shaders
+                MAX_CHANNELS - channelStrokeWidths.length),
+                channelColormapRangeStarts: padWithDefault(channelFeatureValueColormapRanges.map(r => r?.[0] || 0.0), 0.0, 
+                // There are six texture entries on the shaders
+                MAX_CHANNELS - channelFeatureValueColormapRanges.length),
+                channelColormapRangeEnds: padWithDefault(channelFeatureValueColormapRanges.map(r => r?.[1] || 1.0), 1.0, 
+                // There are six texture entries on the shaders
+                MAX_CHANNELS - channelFeatureValueColormapRanges.length),
+                channelIsStaticColorMode: padWithDefault(channelIsStaticColorMode, true, 
+                // There are six texture entries on the shaders
+                MAX_CHANNELS - channelIsStaticColorMode.length),
+                channelIsSetColorMode: padWithDefault(channelIsSetColorMode, false, 
+                // There are six texture entries on the shaders
+                MAX_CHANNELS - channelIsSetColorMode.length),
+                hovered: hoveredCell || 0,
+                channelsVisible: padWithDefault(channelsVisible, false, 
+                // There are six texture entries on the shaders
+                MAX_CHANNELS - channelsVisible.length),
+                // uColorScaleRange: [colorScaleLo, colorScaleHi],
+                // uIsExpressionMode: isExpressionMode,
+                // uIsOutlined: false,
+                scaleFactor,
+            }))
+                .draw();
+        }
+    }
+    /**
+     * This function creates textures from the data
+     */
+    dataToTexture(data, width, height) {
+        const isWebGL2On = isWebGL2(this.context.gl);
+        return new Texture2D(this.context.gl, {
+            width,
+            height,
+            // Only use Float32 so we don't have to write two shaders
+            data: new Float32Array(data),
+            // we don't want or need mimaps
+            mipmaps: false,
+            parameters: {
+                // NEAREST for integer data
+                [GL.TEXTURE_MIN_FILTER]: GL.NEAREST,
+                [GL.TEXTURE_MAG_FILTER]: GL.NEAREST,
+                // CLAMP_TO_EDGE to remove tile artifacts
+                [GL.TEXTURE_WRAP_S]: GL.CLAMP_TO_EDGE,
+                [GL.TEXTURE_WRAP_T]: GL.CLAMP_TO_EDGE,
+            },
+            format: isWebGL2On ? GL.R32F : GL.LUMINANCE,
+            dataFormat: isWebGL2On ? GL.RED : GL.LUMINANCE,
+            type: GL.FLOAT,
+        });
+    }
+    multiSetsToTexture(multiFeatureValues, setColorValues, channelIsSetColorMode) {
+        const isWebGL2On = isWebGL2(this.context.gl);
+        const [totalData, valueTexHeight, indicesOffsets, totalColors, colorTexHeight, colorsOffsets,] = multiSetsToTextureData(multiFeatureValues, setColorValues, channelIsSetColorMode, MULTI_FEATURE_TEX_SIZE);
+        return [
+            // Color indices texture
+            new Texture2D(this.context.gl, {
+                width: MULTI_FEATURE_TEX_SIZE,
+                height: valueTexHeight,
+                // Only use Float32 so we don't have to write two shaders
+                data: new Float32Array(totalData),
+                // we don't want or need mimaps
+                mipmaps: false,
+                parameters: {
+                    // NEAREST for integer data
+                    [GL.TEXTURE_MIN_FILTER]: GL.NEAREST,
+                    [GL.TEXTURE_MAG_FILTER]: GL.NEAREST,
+                    // CLAMP_TO_EDGE to remove tile artifacts
+                    [GL.TEXTURE_WRAP_S]: GL.CLAMP_TO_EDGE,
+                    [GL.TEXTURE_WRAP_T]: GL.CLAMP_TO_EDGE,
+                },
+                format: isWebGL2On ? GL.R32F : GL.LUMINANCE,
+                dataFormat: isWebGL2On ? GL.RED : GL.LUMINANCE,
+                type: GL.FLOAT,
+            }),
+            // Colors texture
+            new Texture2D(this.context.gl, {
+                width: MULTI_FEATURE_TEX_SIZE,
+                height: colorTexHeight,
+                // Only use Float32 so we don't have to write two shaders
+                data: new Float32Array(totalColors),
+                // we don't want or need mimaps
+                mipmaps: false,
+                parameters: {
+                    // NEAREST for integer data
+                    [GL.TEXTURE_MIN_FILTER]: GL.NEAREST,
+                    [GL.TEXTURE_MAG_FILTER]: GL.NEAREST,
+                    // CLAMP_TO_EDGE to remove tile artifacts
+                    [GL.TEXTURE_WRAP_S]: GL.CLAMP_TO_EDGE,
+                    [GL.TEXTURE_WRAP_T]: GL.CLAMP_TO_EDGE,
+                },
+                format: isWebGL2On ? GL.R32F : GL.LUMINANCE,
+                dataFormat: isWebGL2On ? GL.RED : GL.LUMINANCE,
+                type: GL.FLOAT,
+            }),
+            // Offsets
+            indicesOffsets,
+            colorsOffsets,
+            // Texture heights
+            valueTexHeight,
+            colorTexHeight,
+        ];
+    }
+}
+BitmaskLayer.layerName = 'BitmaskLayer';
+BitmaskLayer.defaultProps = defaultProps;

package/dist-tsc/SelectionLayer.d.ts

@@ -1,5 +1,6 @@
 declare class SelectionLayer {
     _selectPolygonObjects(coordinates: any): void;
+    _selectEmpty(): void;
     renderLayers(): EditableGeoJsonLayer[];
 }
 declare namespace SelectionLayer {

package/dist-tsc/SelectionLayer.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectionLayer.d.ts","sourceRoot":"","sources":["../src/SelectionLayer.js"],"names":[],"mappings":"AAqEA;IACE,8CA0DC;IAED,uCAoDC;CACF;;;;;;;;;IAxJW,0BAAQ"}
+{"version":3,"file":"SelectionLayer.d.ts","sourceRoot":"","sources":["../src/SelectionLayer.js"],"names":[],"mappings":"AAqEA;IACE,8CAqEC;IAED,qBAMC;IAED,uCAmDC;CACF;;;;;;;;;IA1KW,0BAAQ"}

package/dist-tsc/SelectionLayer.js

@@ -61,48 +61,62 @@ const PASS_THROUGH_PROPS = [
 ];
 export default class SelectionLayer extends CompositeLayer {
     _selectPolygonObjects(coordinates) {
-        const { onSelect, getCellCoords, cellsQuadTree, flipY, } = this.props;
+        const { flipY, obsLayers, } = this.props;
         const flippedCoordinates = (flipY
             ? coordinates.map(poly => poly.map(p => ([p[0], -p[1]])))
             : coordinates);
         // Convert the selection to a turf polygon object.
         const selectedPolygon = turfPolygon(flippedCoordinates);
-        // Create an array to store the results.
-        const pickingInfos = [];
         // quadtree.visit() takes a callback that returns a boolean:
         // If true returned, then the children of the node are _not_ visited.
         // If false returned, then the children of the node are visited.
         // Reference: https://github.com/d3/d3-quadtree#quadtree_visit
-        cellsQuadTree.visit((node, x0, y0, x1, y1) => {
-            const nodePoints = [[[x0, y0], [x1, y0], [x1, y1], [x0, y1], [x0, y0]]];
-            const nodePolygon = turfPolygon(nodePoints);
-            const nodePolygonContainsSelectedPolygon = booleanContains(nodePolygon, selectedPolygon);
-            const nodePolygonWithinSelectedPolygon = booleanWithin(nodePolygon, selectedPolygon);
-            const nodePolygonOverlapsSelectedPolgyon = booleanOverlap(nodePolygon, selectedPolygon);
-            if (!nodePolygonContainsSelectedPolygon
-                && !nodePolygonWithinSelectedPolygon
-                && !nodePolygonOverlapsSelectedPolgyon) {
-                // We are not interested in anything below this node,
-                // so return true because we are done with this node.
-                return true;
-            }
-            // This node made it past the above return statement, so it must either
-            // contain, be within, or overlap with the selected polygon.
-            // Check if this is a leaf node.
-            if (node.data
-                && booleanPointInPolygon(turfPoint([].slice.call(getCellCoords(node.data))), selectedPolygon)) {
-                // This node has data, so it is a leaf node representing one data point,
-                // and we have verified that the point is in the selected polygon.
-                pickingInfos.push(node.data);
-            }
-            // Return false because we are not done.
-            // We want to visit the children of this node.
-            return false;
+        obsLayers.forEach((obsLayer) => {
+            const { getObsCoords, obsQuadTree, obsIndex, onSelect: layerOnSelect, } = obsLayer;
+            // Create an array to store the results.
+            // Clear the array before checking each new layer.
+            const pickingInfos = [];
+            // It is possible for a layer to not have an obsQuadTree,
+            // for example if the layer is a segmentation bitmask without associated
+            // obsLocations.
+            obsQuadTree?.visit((node, x0, y0, x1, y1) => {
+                const nodePoints = [[[x0, y0], [x1, y0], [x1, y1], [x0, y1], [x0, y0]]];
+                const nodePolygon = turfPolygon(nodePoints);
+                const nodePolygonContainsSelectedPolygon = booleanContains(nodePolygon, selectedPolygon);
+                const nodePolygonWithinSelectedPolygon = booleanWithin(nodePolygon, selectedPolygon);
+                const nodePolygonOverlapsSelectedPolgyon = booleanOverlap(nodePolygon, selectedPolygon);
+                if (!nodePolygonContainsSelectedPolygon
+                    && !nodePolygonWithinSelectedPolygon
+                    && !nodePolygonOverlapsSelectedPolgyon) {
+                    // We are not interested in anything below this node,
+                    // so return true because we are done with this node.
+                    return true;
+                }
+                // This node made it past the above return statement, so it must either
+                // contain, be within, or overlap with the selected polygon.
+                // Check if this is a leaf node.
+                if (node.data
+                    && booleanPointInPolygon(turfPoint([].slice.call(getObsCoords(node.data))), selectedPolygon)) {
+                    // This node has data, so it is a leaf node representing one data point,
+                    // and we have verified that the point is in the selected polygon.
+                    pickingInfos.push(node.data);
+                }
+                // Return false because we are not done.
+                // We want to visit the children of this node.
+                return false;
+            });
+            const pickingIds = pickingInfos.map(obsI => obsIndex[obsI]);
+            layerOnSelect(pickingIds);
+        });
+    }
+    _selectEmpty() {
+        const { obsLayers } = this.props;
+        obsLayers.forEach((obsLayer) => {
+            const { onSelect: layerOnSelect } = obsLayer;
+            layerOnSelect([]);
         });
-        onSelect({ pickingInfos });
     }
     renderLayers() {
-        const { onSelect } = this.props;
         const mode = MODE_MAP[this.props.selectionType] || ViewMode;
         const inheritedProps = {};
         PASS_THROUGH_PROPS.forEach((p) => {
@@ -126,7 +140,7 @@ export default class SelectionLayer extends CompositeLayer {
                     }
                     else if (editType === EDIT_TYPE_CLEAR) {
                         // We want to select an empty array to clear any previous selection.
-                        onSelect({ pickingInfos: [] });
+                        this._selectEmpty();
                     }
                 },
                 _subLayerProps: {

package/dist-tsc/bitmask-layer-beta-shaders.d.ts

@@ -0,0 +1,3 @@
+export const vs: "\n#define SHADER_NAME bitmask-layer-vertex-shader\n\nattribute vec2 texCoords;\nattribute vec3 positions;\nattribute vec3 positions64Low;\nattribute vec3 instancePickingColors;\n\nvarying vec2 vTexCoord;\n\nvoid main(void) {\n  geometry.worldPosition = positions;\n  geometry.uv = texCoords;\n  geometry.pickingColor = instancePickingColors;\n  gl_Position = project_position_to_clipspace(positions, positions64Low, vec3(0.0), geometry.position);\n  DECKGL_FILTER_GL_POSITION(gl_Position, geometry);\n  vTexCoord = texCoords;\n  vec4 color = vec4(0.0);\n  DECKGL_FILTER_COLOR(color, geometry);\n}\n";
+export const fs: string;
+//# sourceMappingURL=bitmask-layer-beta-shaders.d.ts.map

package/dist-tsc/bitmask-layer-beta-shaders.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"bitmask-layer-beta-shaders.d.ts","sourceRoot":"","sources":["../src/bitmask-layer-beta-shaders.js"],"names":[],"mappings":"AAEA,0mBAoBE;AAEF,wBA6LE"}