@webviz/subsurface-viewer 0.0.1-alpha.1 → 0.0.2-alpha.1

package/src/layers/terrain/map3DLayer.ts

@@ -1,556 +0,0 @@
-import { CompositeLayer, Color } from "@deck.gl/core/typed";
-import TerrainMapLayer, { DECODER, Material } from "./terrainMapLayer";
-import { ExtendedLayerProps, colorMapFunctionType } from "../utils/layerTools";
-import { TerrainLoader } from "@loaders.gl/terrain";
-import { ImageLoader } from "@loaders.gl/images";
-import { load } from "@loaders.gl/core";
-import { Vector3 } from "@math.gl/core";
-import { getModelMatrix } from "../utils/layerTools";
-import { isEqual } from "lodash";
-import { ContinuousLegendDataType } from "../../components/ColorLegend";
-import { Matrix4 } from "math.gl";
-
-type MeshType = {
-    attributes: {
-        POSITION: { value: Float32Array; size: number };
-        TEXCOORD_0: { value: Float32Array; size: number };
-        normals?: { value: Float32Array; size: number };
-    };
-    indices: { value: Uint32Array; size: number };
-};
-
-// These two types both describes the mesh' extent in the horizontal plane.
-type Bounds = [number, number, number, number];
-type Frame = {
-    // mesh origin
-    origin: [number, number];
-
-    // cells size in each direction.
-    increment: [number, number];
-
-    // no cells in each direction.
-    count: [number, number];
-
-    // Rotates map counterclockwise in degrees around 'rotPoint' specified below.
-    rotDeg?: number;
-
-    // Point to rotate around using 'rotDeg'. Defaults to mesh origin.
-    rotPoint?: [number, number];
-};
-
-function getMinMax(dim: Frame): Bounds {
-    const nx = dim.count[0];
-    const ny = dim.count[1];
-
-    const dx = dim.increment[0];
-    const dy = dim.increment[1];
-
-    const xmin = dim.origin[0];
-    const ymin = dim.origin[1];
-
-    const xmax = xmin + nx * dx;
-    const ymax = ymin + ny * dy;
-
-    return [xmin, ymin, xmax, ymax];
-}
-
-function mapToRange(resolved_mesh: MeshType, meshValueRange: [number, number]) {
-    const floatScaler = 1.0 / (256.0 * 256.0 * 256.0 - 1.0);
-    const [min, max] = meshValueRange;
-    const delta = max - min;
-
-    const vertexs = resolved_mesh.attributes.POSITION.value;
-    const nvertexs = vertexs.length / 3;
-
-    for (let i = 0; i < nvertexs; i++) {
-        let Z = vertexs[i * 3 + 2];
-        Z = Z * floatScaler; // maps to [0-1]
-        Z = min + Z * delta;
-        vertexs[i * 3 + 2] = -Z; // depths are positive along negative z axis.
-    }
-
-    return resolved_mesh;
-}
-
-function add_normals(
-    resolved_mesh: MeshType,
-    meshImageData: ImageData,
-    bounds: [number, number, number, number]
-) {
-    const vertexs = resolved_mesh.attributes.POSITION.value;
-    let indices = resolved_mesh.indices.value;
-    let ntriangles = indices.length / 3;
-
-    ////////////////////////////////////////////////////////////////
-    // Remove all triangles that are in undefined areas. That is triangles which
-    const [xmin, ymin, xmax, ymax] = bounds;
-
-    const w = meshImageData.width;
-    const h = meshImageData.height;
-
-    const int_view = new Uint8ClampedArray(
-        meshImageData.data,
-        0,
-        meshImageData.data.length
-    );
-
-    const dx = (xmax - xmin) / (w - 1);
-    const dy = (ymax - ymin) / (h - 1);
-
-    const indices_reduced: number[] = [];
-    for (let tn = 0; tn < ntriangles; tn++) {
-        const i0 = indices[tn * 3 + 0];
-        const i1 = indices[tn * 3 + 1];
-        const i2 = indices[tn * 3 + 2];
-
-        const triangle_indices = [i0, i1, i2];
-
-        const alphas = triangle_indices.map((index) => {
-            const x = vertexs[index * 3 + 0];
-            const y = vertexs[index * 3 + 1];
-
-            // Note: assumes increasing 'j' along increasing X axis and Y axis and
-            // increasing 'i' along decreasing Y axis.
-            // 'j' along image width. 'i' along image height.
-            const j = Math.round((x - xmin) / dx);
-            const i = h - Math.round((y - ymin) / dy);
-            const pixelNo = i * w + j;
-
-            // Check alpha (transparency) for this triangle corner.
-            const is_transparent = int_view[pixelNo * 4 + 3] < 255;
-            return is_transparent;
-        });
-
-        const do_remove = alphas.some((a) => a);
-
-        if (!do_remove) {
-            indices_reduced.push(i0);
-            indices_reduced.push(i1);
-            indices_reduced.push(i2);
-        }
-    }
-
-    resolved_mesh.indices.value = new Uint32Array(indices_reduced);
-    indices = resolved_mesh.indices.value;
-    ntriangles = indices.length / 3;
-
-    ////////////////////////////////////////////////////////////////
-    // Calculate one normal pr triangle. And record the triangles each vertex' belongs to.
-    const no_unique_vertexes = vertexs.length / 3;
-    const vertex_triangles = Array(no_unique_vertexes); // for each vertex a list of triangles it belongs to.
-    for (let i = 0; i < no_unique_vertexes; i++) {
-        vertex_triangles[i] = new Set();
-    }
-
-    const triangle_normals = Array(ntriangles);
-    for (let t = 0; t < ntriangles; t++) {
-        const i0 = indices[t * 3 + 0];
-        const i1 = indices[t * 3 + 1];
-        const i2 = indices[t * 3 + 2];
-
-        vertex_triangles[i0].add(t);
-        vertex_triangles[i1].add(t);
-        vertex_triangles[i2].add(t);
-
-        // Triangles' three corners.
-        const v0 = new Vector3(
-            vertexs[i0 * 3 + 0],
-            vertexs[i0 * 3 + 1],
-            vertexs[i0 * 3 + 2]
-        );
-        const v1 = new Vector3(
-            vertexs[i1 * 3 + 0],
-            vertexs[i1 * 3 + 1],
-            vertexs[i1 * 3 + 2]
-        );
-        const v2 = new Vector3(
-            vertexs[i2 * 3 + 0],
-            vertexs[i2 * 3 + 1],
-            vertexs[i2 * 3 + 2]
-        );
-
-        const vec1 = v1.subtract(v0);
-        const vec2 = v2.subtract(v0);
-
-        const normal = vec1.cross(vec2).normalize();
-        triangle_normals[t] = normal;
-    }
-
-    // Calculate normals. The vertex normal will be the mean of the normals of every triangle the vertex
-    // belongs to.
-    const normals = Array(vertexs.length).fill(0.0);
-
-    for (let i = 0; i < no_unique_vertexes; i++) {
-        const triangles = [...vertex_triangles[i]];
-        // Set normal to mean of all triangle normals.
-        const v =
-            triangles.length !== 0
-                ? triangle_normals[triangles[0]]
-                : new Vector3(0.0, 0.0, 1.0);
-        for (let t = 1; t < triangles.length; t++) {
-            v.add(triangle_normals[triangles[t]]);
-        }
-        v.normalize();
-
-        const idx = i * 3;
-        normals[idx + 0] = v[0];
-        normals[idx + 1] = v[1];
-        normals[idx + 2] = v[2];
-    }
-
-    resolved_mesh.attributes.normals = {
-        value: new Float32Array(normals),
-        size: 3,
-    };
-
-    return resolved_mesh;
-}
-
-async function load_mesh_and_texture(
-    mesh_name: string,
-    bounds: Bounds,
-    meshMaxError: number,
-    meshValueRange: [number, number],
-    smoothShading: boolean,
-    texture_name: string
-) {
-    const isMesh = mesh_name !== "";
-    const isTexture = texture_name !== "";
-
-    if (!isMesh && !isTexture) {
-        console.error("Error. One or both of texture and mesh must be given!");
-    }
-
-    const image_name = isTexture ? texture_name : mesh_name;
-    const texture = await load(image_name, ImageLoader, {
-        image: { type: "data" }, // Will load as ImageData.
-    });
-
-    let meshImageData: ImageData | null = null;
-
-    let mesh: MeshType;
-    if (isMesh) {
-        mesh = await load(mesh_name, TerrainLoader, {
-            terrain: {
-                elevationDecoder: DECODER,
-                bounds,
-                meshMaxError,
-                skirtHeight: 0.0,
-            },
-            worker: false,
-        });
-
-        // Remap height to meshValueRange
-        mesh = mapToRange(mesh, meshValueRange);
-
-        meshImageData = await load(mesh_name, ImageLoader, {
-            image: { type: "data" }, // Will load as ImageData.
-        });
-
-        // Note: mesh contains triangles. No normals they must be added.
-        if (smoothShading && meshImageData) {
-            mesh = add_normals(mesh, meshImageData, bounds);
-        }
-    } else {
-        // Mesh data is missing.
-        // Make a flat square size of enclosing dim using two triangles.  z = 0.
-        const [minX, minY, maxX, maxY] = bounds;
-        const p0 = [minX, minY, 0.0];
-        const p1 = [minX, maxY, 0.0];
-        const p2 = [maxX, maxY, 0.0];
-        const p3 = [maxX, minY, 0.0];
-        const vertexes = [...p0, ...p1, ...p2, ...p3];
-        const texture_coord = [0.0, 1.0, 0.0, 0.0, 1.0, 0.0, 1.0, 1.0];
-
-        mesh = {
-            attributes: {
-                POSITION: { value: new Float32Array(vertexes), size: 3 },
-                TEXCOORD_0: { value: new Float32Array(texture_coord), size: 2 },
-            },
-            indices: { value: new Uint32Array([0, 1, 3, 1, 3, 2]), size: 1 },
-        };
-    }
-
-    return Promise.all([mesh, meshImageData, texture]);
-}
-
-export interface Map3DLayerProps<D> extends ExtendedLayerProps<D> {
-    // eslint-disable-next-line @typescript-eslint/no-explicit-any
-    setReportedBoundingBox?: any;
-
-    // Url to png image representing the height mesh.
-    mesh: string;
-
-    // Horizontal extent of the terrain mesh.
-    frame?: Frame;
-
-    // Deprecated: mesh's horizonal extent as [xmin, ymin, xmax, ymax]
-    bounds?: [number, number, number, number];
-
-    // Mesh error in meters. The output mesh is in higher resolution (more vertices) if the error is smaller.
-    meshMaxError: number;
-
-    // Url to png image for map properties. (ex, poro or perm values as a texture)
-    propertyTexture: string;
-
-    // Deprecated: Rotates map counterclockwise in degrees around 'rotPoint' specified below.
-    rotDeg?: number;
-
-    // Deprecated: Point to rotate around using 'rotDeg'. Defaults to mesh origin.
-    rotPoint?: [number, number];
-
-    // Contourlines reference point and interval.
-    // A value of [-1.0, -1.0] will disable contour lines.
-    // default value: [-1.0, -1.0]
-    contours: [number, number];
-
-    // Contourlines may be calculated either on depth/z-value or on property/texture value
-    // If this is set to false, lines will follow properties instead of depth.
-    // In 2D mode this is always the case regardless.
-    // default: true
-    isContoursDepth: boolean;
-
-    // Name of color map. E.g "PORO"
-    colorMapName: string;
-
-    // Min and max of map height values values.
-    meshValueRange: [number, number];
-
-    // Min and max property values.
-    propertyValueRange: [number, number];
-
-    // Use color map in this range.
-    colorMapRange: [number, number];
-
-    // Clamp colormap to this color at ends.
-    // Given as array of three values (r,g,b) e.g: [255, 0, 0]
-    // If not set or set to true, it will clamp to color map min and max values.
-    // If set to false the clamp color will be completely transparent.
-    colorMapClampColor: Color | undefined | boolean;
-
-    // Optional function property.
-    // If defined this function will override the color map.
-    // Takes a value in the range [0,1] and returns a color.
-    colorMapFunction?: colorMapFunctionType;
-
-    // Will calculate normals and enable phong shading.
-    smoothShading: boolean;
-
-    // Surface material properties.
-    // material: true  = default material,
-    //           false = no material,
-    //           or full spec:
-    //      material: {
-    //           ambient: 0.35,
-    //           diffuse: 0.6,
-    //           shininess: 32,
-    //           specularColor: [255, 255, 255],
-    //       }
-    material: Material;
-
-    // Enable/disable depth testing when rendering layer. Default true.
-    depthTest: boolean;
-}
-
-const defaultProps = {
-    "@@type": "Map3DLayer",
-    name: "Map 3D",
-    id: "map3d-layer",
-    pickable: true,
-    visible: true,
-    // Url to png image for height field.
-    mesh: "",
-    meshValueRange: { type: "array", value: [0, 1] },
-    // Mesh error in meters. The output mesh is in higher resolution (more vertices) if the error is smaller.
-    meshMaxError: { type: "number", value: 5 },
-    // Url to png image for map properties. (ex, poro or perm values as a texture)
-    propertyTexture: "",
-    propertyValueRange: { type: "array", value: [0, 1] },
-    contours: [-1.0, -1.0],
-    // If contour lines should follow depth or properties.
-    isContoursDepth: true,
-    smoothShading: true,
-    material: true,
-    depthTest: true,
-};
-
-export default class Map3DLayer extends CompositeLayer<
-    Map3DLayerProps<unknown>
-> {
-    initializeState(): void {
-        // Load mesh and texture and store in state.
-        const isBounds = typeof this.props.bounds !== "undefined";
-        if (isBounds) {
-            console.warn('"bounds" is deprecated. Use "frame" instead.');
-        }
-
-        const isFrame = typeof this.props.frame !== "undefined";
-
-        if (!isBounds && !isFrame) {
-            console.error(
-                'Error. Either "Frame" or "bounds" must be given for map3DLayer!'
-            );
-        }
-
-        const bounds = (
-            isFrame ? getMinMax(this.props.frame as Frame) : this.props.bounds
-        ) as Bounds;
-
-        const p = load_mesh_and_texture(
-            this.props.mesh,
-            bounds,
-            this.props.meshMaxError,
-            this.props.meshValueRange,
-            this.props.smoothShading,
-            this.props.propertyTexture
-        );
-
-        p.then(([mesh, meshImageData, texture]) => {
-            this.setState({
-                mesh,
-                meshImageData,
-                texture,
-            });
-        });
-
-        // Report back calculated bounding box now that data is loaded.
-        p.then(() => {
-            const xinc = this.props.frame?.increment?.[0] ?? 0;
-            const yinc = this.props.frame?.increment?.[1] ?? 0;
-
-            const xcount = this.props.frame?.count?.[0] ?? 1;
-            const ycount = this.props.frame?.count?.[1] ?? 1;
-
-            const xMin = this.props.frame?.origin?.[0] ?? bounds[0];
-            const yMin = this.props.frame?.origin?.[1] ?? bounds[1];
-            const zMin = -this.props.meshValueRange[1];
-            const xMax = isFrame ? xMin + xinc * xcount : bounds[2];
-            const yMax = isFrame ? yMin + yinc * ycount : bounds[3];
-            const zMax = -this.props.meshValueRange[0];
-
-            if (typeof this.props.setReportedBoundingBox !== "undefined") {
-                this.props.setReportedBoundingBox([
-                    xMin,
-                    yMin,
-                    zMin,
-                    xMax,
-                    yMax,
-                    zMax,
-                ]);
-            }
-        });
-    }
-
-    updateState({
-        props,
-        oldProps,
-    }: {
-        props: Map3DLayerProps<unknown>;
-        oldProps: Map3DLayerProps<unknown>;
-    }): void {
-        const needs_reload =
-            !isEqual(props.mesh, oldProps.mesh) ||
-            !isEqual(props.bounds, oldProps.bounds) ||
-            !isEqual(props.frame, oldProps.frame) ||
-            !isEqual(props.meshMaxError, oldProps.meshMaxError) ||
-            !isEqual(props.meshValueRange, oldProps.meshValueRange) ||
-            !isEqual(props.smoothShading, oldProps.smoothShading) ||
-            !isEqual(props.propertyTexture, oldProps.propertyTexture);
-
-        if (needs_reload) {
-            // Reload mesh and texture.
-            this.initializeState();
-        }
-    }
-
-    renderLayers(): [TerrainMapLayer] {
-        const isBounds = typeof this.props.bounds !== "undefined";
-        const bounds = (
-            isBounds ? this.props.bounds : getMinMax(this.props.frame as Frame)
-        ) as Bounds;
-
-        // Note: these are deprecated so this code may be deleted later.
-        const isRotDegDefined = typeof this.props.rotDeg !== "undefined";
-        const isRotPointDefined = typeof this.props.rotPoint !== "undefined";
-
-        if (isRotDegDefined) {
-            console.warn('"rotDeg" is deprecated. Use "frame.rotDeg" instead.');
-        }
-
-        if (isRotPointDefined) {
-            console.warn(
-                '"rotPoint" is deprecated. Use "frame.rotPoint" instead.'
-            );
-        }
-
-        const [minX, minY] = [bounds[0], bounds[1]];
-        const center =
-            this.props.frame?.rotPoint ??
-            ((isRotPointDefined ? this.props.rotPoint : [minX, minY]) as [
-                number,
-                number
-            ]);
-
-        const rotatingModelMatrix = getModelMatrix(
-            this.props.frame?.rotDeg ??
-                ((isRotDegDefined ? this.props.rotDeg : 0) as number),
-            center[0],
-            center[1]
-        );
-
-        const isModelMatrix =
-            typeof this.props.modelMatrix !== "undefined" &&
-            this.props.modelMatrix !== null;
-
-        if (isModelMatrix) {
-            rotatingModelMatrix.multiplyRight(
-                this.props.modelMatrix as Matrix4
-            );
-        }
-
-        const isMesh =
-            typeof this.props.mesh !== "undefined" && this.props.mesh !== "";
-
-        const layer = new TerrainMapLayer(
-            this.getSubLayerProps({
-                mesh: this.state["mesh"],
-                texture: this.state["texture"],
-                textureImageData: this.state["texture"],
-                meshImageData: this.state["meshImageData"],
-                meshValueRange: this.props.meshValueRange,
-                pickable: this.props.pickable,
-                modelMatrix: rotatingModelMatrix,
-                contours: this.props.contours,
-                colorMapName: this.props.colorMapName,
-                colorMapFunction: this.props.colorMapFunction,
-                propertyValueRange: this.props.propertyValueRange,
-                colorMapRange: this.props.colorMapRange,
-                colorMapClampColor: this.props.colorMapClampColor,
-                isContoursDepth: !isMesh ? false : this.props.isContoursDepth,
-                material: this.props.material,
-                wireframe: false,
-                depthTest: this.props.depthTest,
-            })
-        );
-        return [layer];
-    }
-
-    getLegendData(): ContinuousLegendDataType {
-        const colorRange = this.props.colorMapRange;
-        const propertyRange =
-            this.props.propertyTexture && this.props.propertyValueRange;
-        const meshRange = this.props.mesh && this.props.meshValueRange;
-        const legendRange = colorRange || propertyRange || meshRange;
-
-        return {
-            discrete: false,
-            valueRange: legendRange,
-            colorName: this.props.colorMapName,
-            title: "Map3dLayer",
-            colorMapFunction: this.props.colorMapFunction,
-        };
-    }
-}
-
-Map3DLayer.layerName = "Map3DLayer";
-Map3DLayer.defaultProps = defaultProps;