Merge branch 'master' into WellsParameterizedRefine

typescript/packages/subsurface-viewer/CHANGELOG.md

@@ -1,3 +1,17 @@
+## [0.4.3](https://github.com/equinor/webviz-subsurface-components/compare/[email protected]@0.4.3) (2023-10-23)
+
+
+### Bug Fixes
+
+* irrelevant X, Y, Z readout for map layer ([#1731](https://github.com/equinor/webviz-subsurface-components/issues/1731)) ([704334a](https://github.com/equinor/webviz-subsurface-components/commit/704334ac8d63a94136dda0654e9cc6126c56b818)), closes [#1654](https://github.com/equinor/webviz-subsurface-components/issues/1654) [#1724](https://github.com/equinor/webviz-subsurface-components/issues/1724)
+
+## [0.4.2](https://github.com/equinor/webviz-subsurface-components/compare/[email protected]@0.4.2) (2023-10-23)
+
+
+### Bug Fixes
+
+* Grid3DLayer should apply flag "ZIncreasingDownwards" for correct readout of depth. ([#1729](https://github.com/equinor/webviz-subsurface-components/issues/1729)) ([108b660](https://github.com/equinor/webviz-subsurface-components/commit/108b6601b049eb1cc5ed27fc19f25e61c214d09f)), closes [#1723](https://github.com/equinor/webviz-subsurface-components/issues/1723) [#1724](https://github.com/equinor/webviz-subsurface-components/issues/1724)
+
 ## [0.4.1](https://github.com/equinor/webviz-subsurface-components/compare/[email protected]@0.4.1) (2023-10-20)
 
 

typescript/packages/subsurface-viewer/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@webviz/subsurface-viewer",
-    "version": "0.4.1",
+    "version": "0.4.3",
     "description": "",
     "main": "dist/index.js",
     "types": "dist/index.d.ts",

typescript/packages/subsurface-viewer/src/layers/grid3d/fragment.fs.glsl.ts

@@ -20,33 +20,11 @@ uniform vec3 colorMapClampColor;
 uniform bool isClampColor;
 uniform bool isColorMapClampColorTransparent;
 
-vec4 encodeVertexIndexToRGB () {
-
-   float r = 0.0;
-   float g = 0.0;
-   float b = 0.0;
-
-   int idx = vertexIndex;
-
-   if (idx >= (256 * 256) - 1) {
-      r = floor(float(idx) / (256.0 * 256.0));
-      idx -= int(r * (256.0 * 256.0));
-   }
-
-   if (idx >= 256 - 1) {
-      g = floor(float(idx) / 256.0);
-      idx -= int(g * 256.0);
-   }
-
-   b = float(idx);
-
-   return vec4(r / 255.0, g / 255.0, b / 255.0, 1.0);   
-}
 
 void main(void) {
 
    if (picking_uActive && !picking_uAttribute) {
-      gl_FragColor = encodeVertexIndexToRGB ();      
+      gl_FragColor = encodeVertexIndexToRGB(vertexIndex);      
       return;
    }
 

typescript/packages/subsurface-viewer/src/layers/grid3d/grid3dLayer.stories.tsx

@@ -18,7 +18,7 @@ import {
 
 export default {
     component: SubsurfaceViewer,
-    title: "SubsurfaceViewer/Experimental Grid3D",
+    title: "SubsurfaceViewer/Grid3D",
 } as ComponentMeta<typeof SubsurfaceViewer>;
 
 type NumberQuad = [number, number, number, number];
@@ -47,13 +47,14 @@ const grid3dLayer = {
     gridLines: true,
     material: true,
     colorMapName: "Rainbow",
-    ZIncreasingDownwards: false,
+    ZIncreasingDownwards: true,
 };
 
 const axes = {
     "@@type": "AxesLayer",
     id: "axes-layer2",
     bounds: [453150, 5925800, 0, 469400, 5939500, 2000],
+    ZIncreasingDownwards: true,
 };
 const parameters = {
     docs: {
@@ -161,7 +162,7 @@ const randomFunc = math?.random ? math.random : Math.random;
 
 export const PolyhedralCells = Template.bind({});
 PolyhedralCells.args = {
-    bounds: [-50, -50, 50, 50] as NumberQuad,
+    bounds: [-25, -25, 50, 30] as NumberQuad,
     views: {
         layout: [1, 1] as [number, number],
         viewports: [
@@ -174,9 +175,9 @@ PolyhedralCells.args = {
     id: "grid-3d-polyhedral-cell",
     layers: [
         {
-            "@@type": "AxesLayer",
+            ...axes,
             id: "polyhedral-cells-axes",
-            bounds: [-50, -50, -50, 50, 50, 50],
+            bounds: [-15, -15, -15, 40, 20, 15],
         },
         {
             ...grid3dLayer,

typescript/packages/subsurface-viewer/src/layers/grid3d/grid3dLayer.ts

@@ -7,7 +7,6 @@ import type {
     colorMapFunctionType,
 } from "../utils/layerTools";
 import { makeFullMesh } from "./webworker";
-import { isEqual } from "lodash";
 import { load, JSONLoader } from "@loaders.gl/core";
 
 export type WebWorkerParams = {
@@ -83,16 +82,6 @@ async function load_data(
     return Promise.all([points, polys, properties]);
 }
 
-function applyZIncrasingDownward(data: Float32Array, zDownward: boolean) {
-    if (!zDownward) {
-        return;
-    }
-    const count = data.length / 3;
-    for (let i = 0; i < count; ++i) {
-        data[i * 3 + 2] *= -1;
-    }
-}
-
 export interface Grid3DLayerProps extends ExtendedLayerProps {
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
     setReportedBoundingBox?: any;
@@ -200,7 +189,6 @@ export default class Grid3DLayer extends CompositeLayer<Grid3DLayerProps> {
         );
 
         p.then(([points, polys, properties]) => {
-            applyZIncrasingDownward(points, this.props.ZIncreasingDownwards);
             const bbox = GetBBox(points);
 
             // Using inline web worker for calculating the triangle mesh from
@@ -270,11 +258,11 @@ export default class Grid3DLayer extends CompositeLayer<Grid3DLayerProps> {
         oldProps: Grid3DLayerProps;
     }): void {
         const needs_reload =
-            !isEqual(props.pointsData, oldProps.pointsData) ||
-            !isEqual(props.polysData, oldProps.polysData) ||
-            !isEqual(props.propertiesData, oldProps.propertiesData) ||
-            !isEqual(props.ZIncreasingDownwards, oldProps.ZIncreasingDownwards);
-
+            props.pointsData !== oldProps.pointsData ||
+            props.polysData !== oldProps.polysData ||
+            props.propertiesData !== oldProps.propertiesData ||
+            props.gridLines !== oldProps.gridLines ||
+            props.ZIncreasingDownwards !== oldProps.ZIncreasingDownwards;
         if (needs_reload) {
             this.setState({
                 ...this.state,
@@ -304,6 +292,7 @@ export default class Grid3DLayer extends CompositeLayer<Grid3DLayerProps> {
                 propertyValueRange: this.state["propertyValueRange"],
                 material: this.props.material,
                 depthTest: this.props.depthTest,
+                ZIncreasingDownwards: this.props.ZIncreasingDownwards,
             })
         );
         return [layer];

typescript/packages/subsurface-viewer/src/layers/grid3d/privateLayer.ts

@@ -4,7 +4,6 @@ import {
     Layer,
     picking,
     project,
-    phongLighting,
 } from "@deck.gl/core/typed";
 import type { LayerPickInfo, PropertyDataType } from "../utils/layerTools";
 import { createPropertyData } from "../utils/layerTools";
@@ -14,16 +13,14 @@ import type {
     ExtendedLayerProps,
     colorMapFunctionType,
 } from "../utils/layerTools";
-
 import { getImageData } from "../utils/layerTools";
-
+import { Texture2D } from "@luma.gl/webgl";
+import GL from "@luma.gl/constants";
 import vsShader from "./vertex.glsl";
 import fsShader from "./fragment.fs.glsl";
 import vsLineShader from "./vertex_lines.glsl";
 import fsLineShader from "./fragment_lines.glsl";
-
-import { Texture2D } from "@luma.gl/webgl";
-import GL from "@luma.gl/constants";
+import { localPhongLighting, utilities } from "../shader_modules";
 
 const DEFAULT_TEXTURE_PARAMETERS = {
     [GL.TEXTURE_MIN_FILTER]: GL.LINEAR_MIPMAP_LINEAR,
@@ -71,13 +68,15 @@ export interface privateLayerProps extends ExtendedLayerProps {
     gridLines: boolean;
     propertyValueRange: [number, number];
     depthTest: boolean;
+    ZIncreasingDownwards: boolean;
 }
 
 const defaultProps = {
     colorMapName: "",
     coordinateSystem: COORDINATE_SYSTEM.CARTESIAN,
     propertyValueRange: [0.0, 1.0],
     depthTest: true,
+    ZIncreasingDownwards: true,
 };
 
 // This is a private layer used only by the composite Map3DLayer
@@ -129,7 +128,7 @@ export default class privateLayer extends Layer<privateLayerProps> {
                 },
                 vertexCount: this.props.mesh.vertexCount,
             }),
-            modules: [project, picking, phongLighting],
+            modules: [project, picking, localPhongLighting, utilities],
             isInstanced: false, // This only works when set to false.
         });
 
@@ -213,13 +212,19 @@ export default class privateLayer extends Layer<privateLayerProps> {
                 colorMapClampColor,
                 isColorMapClampColorTransparent,
                 isClampColor,
+                ZIncreasingDownwards: this.props.ZIncreasingDownwards,
             })
             .draw();
         gl.disable(gl.POLYGON_OFFSET_FILL);
 
         // Draw lines.
         if (this.props.gridLines) {
-            mesh_lines_model.draw();
+            mesh_lines_model
+                .setUniforms({
+                    ...uniforms,
+                    ZIncreasingDownwards: this.props.ZIncreasingDownwards,
+                })
+                .draw();
         }
 
         if (!this.props.depthTest) {
@@ -254,7 +259,9 @@ export default class privateLayer extends Layer<privateLayerProps> {
         const vertexIndex = 256 * 256 * r + 256 * g + b;
 
         if (info.coordinate?.[2]) {
-            const depth = info.coordinate[2];
+            const depth = this.props.ZIncreasingDownwards
+                ? -info.coordinate[2]
+                : info.coordinate[2];
             layer_properties.push(createPropertyData("Depth", depth));
         }
 

typescript/packages/subsurface-viewer/src/layers/grid3d/vertex.glsl.ts

@@ -3,7 +3,6 @@ const vsShader = `\
 #define SHADER_NAME grid3d-vertex-shader
 precision highp float;
 
-
 attribute vec3 positions;
 attribute float properties;
 
@@ -14,17 +13,23 @@ out float property;
 
 flat out int vertexIndex;
 
+uniform bool ZIncreasingDownwards;
+
 const vec3 pickingColor = vec3(1.0, 1.0, 0.0);
 
 void main(void) { 
    
    vertexIndex = gl_VertexID;
    cameraPosition = project_uCameraPosition;
    property = properties;
-   geometry.pickingColor = pickingColor;   
- 
-   position_commonspace = vec4(project_position(positions), 0.0);
+   geometry.pickingColor = pickingColor;
+
+   vec3 position = positions;
+   position[2] *= ZIncreasingDownwards ? -1.0 : 1.0;
+
+   position_commonspace = vec4(project_position(position), 0.0);
    gl_Position = project_common_position_to_clipspace(position_commonspace);
+
    DECKGL_FILTER_GL_POSITION(gl_Position, geometry);
 
    vec4 color = vec4(0.0);

typescript/packages/subsurface-viewer/src/layers/grid3d/vertex_lines.glsl.ts

@@ -8,8 +8,13 @@ in vec3 positions;
 
 out vec4 position_commonspace;
 
+uniform bool ZIncreasingDownwards;
+
 void main(void) {
-   vec3 position_commonspace = project_position(positions);
+   vec3 position = positions;
+   position[2] *= ZIncreasingDownwards ? -1.0 : 1.0;
+
+   vec3 position_commonspace = project_position(position);
    gl_Position = project_common_position_to_clipspace(vec4(position_commonspace, 0.0));
 }
 `;

typescript/packages/subsurface-viewer/src/layers/map/fragment.fs.glsl.ts

@@ -14,9 +14,7 @@ in vec3 normals_commonspace;
 in vec4 position_commonspace;
 in vec4 vColor;
 
-flat in int vertex_indexs_;
-
-out vec4 fragColor;
+flat in int vertexIndex;
 
 in vec3 worldPos;
 in float property;
@@ -48,27 +46,8 @@ void main(void) {
    }
 
    //Picking pass.
-   if (picking_uActive) {
-      // Express triangle index in 255 system.
-      float r = 0.0;
-      float g = 0.0;
-      float b = 0.0;
-  
-      int idx = vertex_indexs_;
-  
-      if (idx >= (256 * 256) - 1) {
-         r = floor(float(idx) / (256.0 * 256.0));
-         idx -= int(r * (256.0 * 256.0));
-      }
-  
-      if (idx >= 256 - 1) {
-         g = floor(float(idx) / 256.0);
-         idx -= int(g * 256.0);
-      }
-  
-      b = float(idx);
-  
-      fragColor = vec4(r / 255.0, g / 255.0, b / 255.0,  1.0);
+   if (picking_uActive && !picking_uAttribute) {
+      gl_FragColor = encodeVertexIndexToRGB(vertexIndex);
       return;
    }
 
@@ -116,9 +95,9 @@ void main(void) {
 
    // Use normal lighting. This has no effect if "material" property is not set.
    vec3 lightColor = lighting_getLightColor(color.rgb, cameraPosition, position_commonspace.xyz, normal);
-   fragColor = vec4(lightColor, 1.0);
+   gl_FragColor = vec4(lightColor, 1.0);
 
-   DECKGL_FILTER_COLOR(fragColor, geometry);
+   DECKGL_FILTER_COLOR(gl_FragColor, geometry);
 }
 `;
 

typescript/packages/subsurface-viewer/src/layers/map/mapLayer.ts

@@ -345,7 +345,6 @@ export default class MapLayer extends CompositeLayer<MapLayerProps> {
                 normals,
                 triangleIndices,
                 vertexProperties,
-                vertexIndices,
                 lineIndices,
                 meshZValueRange,
                 propertyValueRange,
@@ -357,7 +356,6 @@ export default class MapLayer extends CompositeLayer<MapLayerProps> {
                 normals,
                 triangleIndices,
                 vertexProperties,
-                vertexIndices,
                 lineIndices,
                 propertyValueRange,
             });
@@ -484,7 +482,6 @@ export default class MapLayer extends CompositeLayer<MapLayerProps> {
                 normals: this.state["normals"],
                 triangleIndices: this.state["triangleIndices"],
                 vertexProperties: this.state["vertexProperties"],
-                vertexIndices: this.state["vertexIndices"],
                 lineIndices: this.state["lineIndices"],
                 pickable: this.props.pickable,
                 modelMatrix: rotatingModelMatrix,
@@ -499,6 +496,7 @@ export default class MapLayer extends CompositeLayer<MapLayerProps> {
                 material: this.props.material,
                 smoothShading: this.props.smoothShading,
                 depthTest: this.props.depthTest,
+                ZIncreasingDownwards: this.props.ZIncreasingDownwards,
             })
         );
         return [layer];