@webviz/subsurface-viewer/dist/layers/BoxSelectionLayer/boxSelectionLayer.js

3D visualization component for subsurface reservoir data

import { SelectionLayer } from "@deck.gl-community/editable-layers";
import { CompositeLayer } from "@deck.gl/core";
import { GeoJsonLayer } from "@deck.gl/layers";
import { getSize } from "../wells/wellsLayer";
const defaultProps = {
    name: "boxSelection",
    id: "boxSelection-layer",
    pickable: true,
    visible: true,
    // Props used to get/set data in the box selection layer.
    selectedFeatureIndexes: [],
    data: {
        type: "FeatureCollection",
        features: [],
    },
};
// Composite layer that contains an Selection Lyaer from nebula.gl
// See https://nebula.gl/docs/api-reference/layers/selection-layer
export default class BoxSelectionLayer extends CompositeLayer {
    setMultiSelection(pickingInfos) {
        if (this.internalState) {
            const data = pickingInfos
                .map((item) => item.object)
                .filter((item) => item.type === "Feature");
            this.setState({
                pickingInfos: pickingInfos,
                data: data,
            });
        }
    }
    renderLayers() {
        var _a, _b;
        if (this.props.visible == false) {
            return [];
        }
        const LINE = "line";
        const POINT = "point";
        const isOrthographic = this.context.viewport.constructor.name === "OrthographicViewport";
        const positionFormat = isOrthographic ? "XY" : "XYZ";
        const geoJsonLayer = new GeoJsonLayer({
            id: "geoJson",
            data: this.state["data"],
            pickable: false,
            stroked: false,
            positionFormat,
            pointRadiusUnits: "pixels",
            lineWidthUnits: "pixels",
            pointRadiusScale: this.props.pointRadiusScale
                ? this.props.pointRadiusScale
                : 1,
            lineWidthScale: this.props.lineWidthScale
                ? this.props.lineWidthScale
                : 1,
            getLineWidth: getSize(LINE, (_a = this.props.lineStyle) === null || _a === void 0 ? void 0 : _a.width, -1),
            getPointRadius: getSize(POINT, (_b = this.props.wellHeadStyle) === null || _b === void 0 ? void 0 : _b.size, 2),
            getFillColor: [255, 140, 0],
            getLineColor: [255, 140, 0],
        });
        const selectionLayer = new SelectionLayer(this.getSubLayerProps({
            id: "selection",
            selectionType: "rectangle",
            onSelect: ({ pickingInfos, }) => {
                this.setMultiSelection(pickingInfos);
                if (this.props.handleSelection) {
                    this.props.handleSelection(pickingInfos);
                }
            },
            layerIds: this.props.layerIds,
            getTentativeFillColor: () => [255, 0, 255, 100],
            getTentativeLineColor: () => [0, 0, 255, 255],
            getTentativeLineDashArray: () => [0, 0],
            lineWidthMinPixels: 3,
        }));
        return [selectionLayer, geoJsonLayer];
    }
}
BoxSelectionLayer.layerName = "BoxSelectionLayer";
BoxSelectionLayer.defaultProps =
    defaultProps;
//# sourceMappingURL=boxSelectionLayer.js.map