feat: lithology track with pattern

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_TOT",
+        "description": "continuous",
+        "quantity": "",
+        "unit": "",
+        "valueType": "float",
+        "dimensions": 1
+    }
+    ],
+    "data": [
+      [
+        1400,
+        2,
+        2,
+        0.247
+      ],
+      [
+        2179,
+        2,
+        1,
+        0.247
+      ],
+      [
+        2180.6093750344276,
+        3,
+        2,
+        0.137
+      ],
+      [
+        3541.6093750344276,
+        3,
+        3,
+        0.237
+      ],
+      [
+        4000,
+        4,
+        5,
+        0.337
+      ]
+    ]
+  }
+]

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

@@ -0,0 +1,186 @@
+{
+    "name": "Template 1",
+    "scale": {
+        "primary": "tvd",
+        "allowSecondary": true
+    },
+    "tracks": [
+        {
+          "plots": [
+            {
+              "name": "ZONELOG",
+              "style": "discrete"
+            }
+          ]
+        },
+        {
+          "plots": [
+            {
+              "name": "PORO"
+            },
+            {
+              "name": "NTG"
+            },
+            {
+              "name": "SW"
+            }
+          ]
+        },
+        {
+          "plots": [
+            {
+              "name": "FACIES",
+              "style": "discretecanvas"
+            }
+          ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "MFOA"
+                }
+            ]
+        },
+        {
+          "plots": [
+            {
+              "name": "FACIES",
+              "style": "discrete"
+            }
+          ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "DD_VOLUME"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "TEMP"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "BITSIZE"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "GRSIM"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "RACESHM"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "SW",
+                    "type": "line"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "MFIA",
+                    "type": "dot"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "MDIA",
+                    "style": "MD"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "MTOA"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "MTIA"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "ECDT"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "BDTI"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "BDDI"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "BRVC"
+                }
+            ]
+        },
+        {
+            "plots": [
+                {
+                    "name": "TCTI"
+                }
+            ]
+        }
+    ],
+    "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}