fix(grid3d): Color fighting with clamp color is fixed. (#1998)

Tiny tolerance value is now used to define when clamp color is to be used in the fragment shader. --------- Co-authored-by: leonid.polukhin <[email protected]>
equinor · Apr 4, 2024 · 4b83d1a · 4b83d1a
1 parent 0d5332e
commit 4b83d1a
Show file tree

Hide file tree

Showing 4 changed files with 78 additions and 9 deletions.
diff --git a/typescript/packages/subsurface-viewer/src/layers/grid3d/fragment.fs.glsl.ts b/typescript/packages/subsurface-viewer/src/layers/grid3d/fragment.fs.glsl.ts
@@ -26,7 +26,7 @@ vec4 getContinuousPropertyColor (float propertyValue) {
 
    vec4 color = vec4(1.0, 1.0, 1.0, 1.0);
    float x = (propertyValue - colorMapRangeMin) / (colorMapRangeMax - colorMapRangeMin);
-   if (x < 0.0 || x > 1.0) {
+   if (x < 0.0 - 1e-4 || x > 1.0 + 1e-4) {
       // Out of range. Use clampcolor.
       if (isClampColor) {
          color = vec4(colorMapClampColor.rgb, 1.0);

diff --git a/...ples/__image_snapshots__/subsurfaceviewer-examples--mixed-layer-definitions.png b/...ples/__image_snapshots__/subsurfaceviewer-examples--mixed-layer-definitions.png
diff --git a/typescript/packages/subsurface-viewer/src/storybook/layers/Grid3DLayer.stories.tsx b/typescript/packages/subsurface-viewer/src/storybook/layers/Grid3DLayer.stories.tsx
@@ -256,18 +256,35 @@ const layerArrays = {
     },
 };
 
-function replaceArrays(args: SubsurfaceViewerProps) {
+function replaceAllArrays(args: SubsurfaceViewerProps) {
     args.layers?.forEach((layer: TLayerDefinition) => {
-        const layerId = layer?.["id"] as string | undefined;
-        if (layer && layerId && layerArrays[layerId]) {
-            for (const key in layerArrays[layerId]) {
-                layer[key] = layerArrays[layerId][key];
-            }
-        }
+        replaceLayerArrays(layer);
     });
     return args;
 }
 
+function replaceArrays(args: SubsurfaceViewerProps, keys: string[]) {
+    args.layers?.forEach((layer: TLayerDefinition) => {
+        replaceLayerArrays(layer, keys);
+    });
+    return args;
+}
+
+function replaceLayerArrays(
+    layer: TLayerDefinition,
+    keys: string[] | undefined = undefined
+) {
+    const layerId = layer?.["id"] as string | undefined;
+    if (layer && layerId && layerArrays[layerId]) {
+        if (!keys) {
+            keys = Object.keys(layerArrays[layerId]) as string[];
+        }
+        for (const key of keys) {
+            layer[key] = layerArrays[layerId][key];
+        }
+    }
+}
+
 export const DiscretePropertyWithClamping: StoryObj<typeof SubsurfaceViewer> = {
     args: {
         bounds: [-2500, -2500, 2500, 2500] as NumberQuad,
@@ -308,5 +325,57 @@ export const DiscretePropertyWithClamping: StoryObj<typeof SubsurfaceViewer> = {
         ],
     },
     parameters: parameters,
-    render: (args) => <SubsurfaceViewer {...replaceArrays(args)} />,
+    render: (args) => <SubsurfaceViewer {...replaceAllArrays(args)} />,
+};
+
+export const CustomColorFuncWithClamping: StoryObj<typeof SubsurfaceViewer> = {
+    args: {
+        bounds: [-2500, -2500, 2500, 2500] as NumberQuad,
+        views: {
+            layout: [1, 1] as [number, number],
+            viewports: [
+                {
+                    id: "view_1",
+                    show3D: true,
+                },
+            ],
+        },
+        id: "grid-3d-discrete_props",
+        layers: [
+            {
+                ...axes,
+                id: "discrete_props-axes",
+                bounds: [-2000, -2200, -2200, 2200, 2000, -1000],
+            },
+            {
+                ...grid3dLayer,
+                "@@typedArraySupport": true,
+                id: discretePropsLayerId,
+                coloringMode: TGrid3DColoringMode.Property,
+                pickable: true,
+                pointsData: layerArrays[discretePropsLayerId].pointsData,
+                polysData: layerArrays[discretePropsLayerId].polysData,
+                propertiesData:
+                    layerArrays[discretePropsLayerId].propertiesData,
+                colorMapName: "Seismic",
+                ZIncreasingDownwards: true,
+                colorMapFunction: function (v) {
+                    return [255 * v, 0, 255 * (1 - v)];
+                },
+                material: false,
+                colorMapRange: [3, 10],
+                colorMapClampColor: [100, 100, 100],
+            },
+        ],
+    },
+    parameters: parameters,
+    render: (args) => (
+        <SubsurfaceViewer
+            {...replaceArrays(args, [
+                "pointsData",
+                "polysData",
+                "propertiesData",
+            ])}
+        />
+    ),
 };
diff --git a/..._snapshots__/subsurfaceviewer-grid3d-layer--custom-color-func-with-clamping.png b/..._snapshots__/subsurfaceviewer-grid3d-layer--custom-color-func-with-clamping.png