feat: lithology track with pattern

examples/example_sync_log_viewer/well_correlation_panel_app.py

@@ -0,0 +1,80 @@
+from pathlib import Path
+
+import dash
+import flask
+
+from examples.example_sync_log_viewer.example_data import (
+    axis_mnemos,
+    axisTitles,
+    color_tables,
+    lithology_info_table,
+    patterns,
+    patternsTable,
+    spacers,
+    templates,
+    wellDistances,
+    welllogs_two_wells,
+    wellpickFlatting,
+    wellpicks,
+)
+from webviz_subsurface_components import SyncLogViewer
+
+slv = SyncLogViewer(
+    id="WellCorrelation-viewer",
+    welllogs=welllogs_two_wells,
+    wellpicks=wellpicks,
+    patterns=patterns,
+    spacers=spacers,
+    wellDistances=wellDistances,
+    templates=templates,
+    wellpickFlatting=wellpickFlatting,
+    colorTables=color_tables,
+    patternsTable=patternsTable,  # {'patternSize': 24, 'patterns': [], 'names': []},
+    axisTitles=axisTitles,
+    axisMnemos=axis_mnemos,
+    syncContentDomain=False,
+    syncContentSelection=True,
+    syncTrackPos=True,
+    syncTemplate=True,
+    horizontal=False,
+    viewTitles=True,
+    welllogOptions={"wellpickColorFill": False, "wellpickPatternFill": False},
+    lithologyInfoTable=lithology_info_table,
+    # spacerOptions={
+    #   "wellpickColorFill": True,
+    #   "wellpickPatternFill": True
+    # }
+)
+
+static_image_route = "/static/"
+
+app = dash.Dash(__name__)
+app.layout = dash.html.Div(
+    id="app-id",
+    style={
+        "height": "100%",
+        "width": "80%",
+        "position": "absolute",
+    },
+    children=[
+        slv,
+    ],
+)
+
+
+@app.server.route("/static/<image_path>.gif")
+def serve_image(image_path):
+    image_name = "{}.gif".format(image_path)
+    # Images are located in react/src/demo/example-data/pattern
+    return flask.send_from_directory(
+        Path(__file__).parent.parent.parent / "react/src/demo/example-data/patterns",
+        image_name,
+    )
+
+
+if __name__ == "__main__":
+    app.run_server(
+        host="localhost",
+        port=8000,
+        debug=True,
+    )

react/src/demo/example-data/discrete-facies-test.json

@@ -0,0 +1,79 @@
+[
+  {
+    "header": {
+      "name": "LIS1  .001",
+      "well": "15/9-19A",
+      "operator": "STATOIL",
+      "source": "Converted from LIS by Log Studio 4.87 - Petroware AS",
+      "startIndex": 2179,
+      "endIndex": 4131,
+      "step": 1
+    },
+    "curves": [
+      {
+          "name": "MD",
+          "description": "continuous",
+          "quantity": "m",
+          "unit": "m",
+          "valueType": "float",
+          "dimensions": 1
+      },
+      {
+          "name": "ZONELOG",
+          "description": "discrete",
+          "quantity": "DISC",
+          "unit": "DISC",
+          "valueType": "integer",
+          "dimensions": 1
+      },
+      {
+          "name": "FACIES",
+          "description": "discrete",
+          "quantity": "DISC",
+          "unit": "DISC",
+          "valueType": "integer",
+          "dimensions": 1
+      },
+      {
+        "name": "PORO",
+        "description": "continuous",
+        "quantity": "",
+        "unit": "",
+        "valueType": "float",
+        "dimensions": 1
+    }
+    ],
+    "data": [
+      [
+        1400,
+        2,
+        1,
+        0.247
+      ],
+      [
+        2179,
+        1,
+        2,
+        0.247
+      ],
+      [
+        2300.0,
+        3,
+        3,
+        0.137
+      ],
+      [
+        3541.6,
+        3,
+        4,
+        0.237
+      ],
+      [
+        4000,
+        4,
+        5,
+        0.337
+      ]
+    ]
+  }
+]

react/src/demo/example-data/synclog_template_lithologytrack.json

@@ -0,0 +1,86 @@
+{
+    "name": "Template 1",
+    "scale": {
+        "primary": "tvd",
+        "allowSecondary": true
+    },
+    "tracks": [
+        {
+          "plots": [
+            {
+              "name": "ZONELOG",
+              "style": "discrete"
+            }
+          ]
+        },
+        {
+          "plots": [
+            {
+              "name": "FACIES",
+              "style": "discretecanvas"
+            }
+          ]
+        },
+        {
+          "plots": [
+            {
+              "name": "PORO"
+            },
+            {
+              "name": "NTG"
+            },
+            {
+              "name": "SW"
+            }
+          ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "MFOA"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "SW",
+                    "type": "line"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "MFIA",
+                    "type": "dot"
+                }
+            ]
+        }
+    ],
+    "styles": [
+        {
+            "name": "HKL",
+            "type": "gradientfill",
+            "colorTable": "Physics",
+            "color": "green"
+        },
+        {
+            "name": "MD",
+            "scale": "linear",
+            "type": "area",
+            "color": "blue",
+            "fill": "green"
+        },
+        {
+          "name": "discretecanvas",
+          "type": "canvas",
+          "colorTable": "Stratigraphy"
+        },
+        {
+          "name": "discrete",
+          "type": "stacked",
+          "colorTable": "Stratigraphy"
+        }
+    ]
+}

react/src/lib/components/WellLogViewer/SyncLogViewer.stories.jsx

@@ -359,3 +359,80 @@ Default.args = {
         wellpickPatternFill: true,
     },
 };
+
+const lithologyInfoTable = {
+    codes: ["1", "2", "3", "4", "5"],
+    names: patternNamesEnglish,
+    images: patternImages,
+    colors: [
+        [255, 193, 0],
+        [255, 155, 76],
+        [255, 223, 161],
+        [204, 153, 255],
+        [101, 167, 64],
+        [255, 243, 53],
+    ],
+};
+
+export const LithofaciesTrack = Template.bind({});
+LithofaciesTrack.args = {
+    id: "Sync-Log-Viewer-litho",
+    syncTrackPos: true,
+    syncContentDomain: true,
+    syncContentSelection: true,
+    syncTemplate: true,
+    horizontal: false,
+
+    welllogs: [
+        require("../../../demo/example-data/discrete-facies-test.json")[0],
+        require("../../../demo/example-data/L916MUD.json")[0],
+        require("../../../demo/example-data/Lis1.json")[0],
+    ],
+    templates: [
+        require("../../../demo/example-data/synclog_template_lithologytrack.json"),
+        require("../../../demo/example-data/synclog_template.json"),
+        require("../../../demo/example-data/synclog_template.json"),
+    ],
+    colorTables: colorTables,
+    lithologyInfoTable: lithologyInfoTable,
+    wellpicks: [
+        {
+            wellpick: require("../../../demo/example-data/wellpicks.json")[0],
+            name: "HORIZON",
+            colorTables: require("../../../demo/example-data/wellpick_colors.json"),
+            color: "Stratigraphy",
+        },
+        {
+            wellpick: require("../../../demo/example-data/wellpicks.json")[1],
+            name: "HORIZON",
+            colorTables: require("../../../demo/example-data/wellpick_colors.json"),
+            color: "Stratigraphy",
+        },
+        {
+            wellpick: require("../../../demo/example-data/wellpicks.json")[0],
+            name: "HORIZON",
+            colorTables: require("../../../demo/example-data/wellpick_colors.json"),
+            color: "Stratigraphy",
+        },
+    ],
+    wellpickFlatting: ["Hor_2", "Hor_4"],
+    spacers: [312, 255],
+    wellDistances: {
+        units: "m",
+        distances: [2048.3, 512.7],
+    },
+
+    axisTitles: axisTitles,
+    axisMnemos: axisMnemos,
+
+    viewTitles: true, // show default welllog view titles (a wellname from the welllog)
+
+    welllogOptions: {
+        wellpickColorFill: false,
+        wellpickPatternFill: false,
+    },
+    spacerOptions: {
+        wellpickColorFill: false,
+        wellpickPatternFill: false,
+    },
+};

react/src/lib/components/WellLogViewer/SyncLogViewer.tsx

@@ -36,7 +36,7 @@ import { LogViewer } from "@equinor/videx-wellog";
 import { Info, InfoOptions } from "./components/InfoTypes";
 
 import { isEqualRanges } from "./components/WellLogView";
-//import { boolean } from "mathjs";
+import { LithologyInfoTable } from "./components/LithologyTrack";
 
 export function isEqualArrays(
     // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -70,9 +70,14 @@ interface Props {
      * Prop containing color table data.
      */
     colorTables: ColorTable[];
+    /**
+     * Table of codes, names, patterns and color for lithology (canvas) tracks
+     */
+    lithologyInfoTable?: LithologyInfoTable;
     /**
      * Set to true for default titles or to array of individial welllog titles
      */
+
     viewTitles?: boolean | (boolean | string | JSX.Element)[];
 
     /**
@@ -175,6 +180,9 @@ export const argTypesSyncLogViewerProp = {
     colorTables: {
         description: "Prop containing color table data.",
     },
+    lithologyInfoTable: {
+        description: "Code, name, color and image for lithology tracks",
+    },
     wellpicks: {
         description: "Well Picks data array",
     },
@@ -851,6 +859,7 @@ class SyncLogViewer extends Component<Props, State> {
                 viewTitle={viewTitle}
                 template={template}
                 colorTables={this.props.colorTables}
+                lithologyInfoTable={this.props.lithologyInfoTable}
                 wellpick={this.props.wellpicks?.[index]}
                 patternsTable={this.props.patternsTable}
                 patterns={this.props.patterns}
@@ -1069,7 +1078,10 @@ SyncLogViewer.propTypes = {
      * Prop containing color table data
      */
     colorTables: PropTypes.array.isRequired,
-
+    /**
+     * Table of codes, names, patterns and color for lithology (canvas) tracks
+     */
+    lithologyInfoTable: PropTypes.object,
     /**
      * Well Picks data array
      */