Add showMesh parameter to toggle mesh display

Author: nikoscham

src/utilities/helperFunctionsScript.js

@@ -16,11 +16,10 @@ export async function printVersion() {
   const releaseResponse = await fetch('https://api.github.com/repos/FEAScript/FEAScript/releases/latest');
   const releaseData = await releaseResponse.json();
   console.log(`FEAScript version: ${releaseData.tag_name} - ${releaseData.name}`);
-  //console.log(`Release date: ${new Date(releaseData.published_at).toLocaleString()}`);
 
   // Fetch the latest commit date
-  const commitResponse = await fetch('https://api.github.com/repos/FEAScript/FEAScript/commits/main');
-  const commitData = await commitResponse.json();
-  const latestCommitDate = new Date(commitData.commit.committer.date).toLocaleString();
-  console.log(`Latest FEAScript update: ${latestCommitDate}`);
+  //const commitResponse = await fetch('https://api.github.com/repos/FEAScript/FEAScript/commits/main');
+  //const commitData = await commitResponse.json();
+  //const latestCommitDate = new Date(commitData.commit.committer.date).toLocaleString();
+  //console.log(`Latest FEAScript update: ${latestCommitDate}`);
 }

src/visualization/plotSolutionScript.js

@@ -16,14 +16,16 @@
  * @param {string} meshDimension - The dimension of the solution
  * @param {string} plotType - The type of plot
  * @param {string} plotDivId - The id of the div where the plot will be rendered
+ * @param {boolean} showMesh - Flag to indicate if the mesh should be shown
  */
 export function plotSolution(
   solutionVector,
   nodesCoordinates,
   solverConfig,
   meshDimension,
   plotType,
-  plotDivId
+  plotDivId,
+  showMesh = false // Currently only for rectuangular domains
 ) {
   const { nodesXCoordinates, nodesYCoordinates } = nodesCoordinates;
 
@@ -66,17 +68,47 @@ export function plotSolution(
     }
 
     // Create the data structure for the contour plot
-    let data = [
-      {
-        z: transposedSolution,
-        type: "contour",
-        contours: {
-          coloring: "heatmap",
-        },
-        x: reshapedXForPlot,
-        y: reshapedYCoordinates[0],
+    let contourData = {
+      z: transposedSolution,
+      type: "contour",
+      contours: {
+        coloring: "heatmap",
       },
-    ];
+      x: reshapedXForPlot,
+      y: reshapedYCoordinates[0],
+    };
+
+    // Create mesh lines for the computational grid if showMesh is true
+    let meshData = [];
+    if (showMesh) {
+      let meshLinesX = [];
+      let meshLinesY = [];
+
+      // Horizontal mesh lines
+      for (let i = 0; i < numNodesY; i++) {
+        meshLinesX.push(...reshapedXCoordinates.map((row) => row[i]), null);
+        meshLinesY.push(...reshapedYCoordinates.map((row) => row[i]), null);
+      }
+
+      // Vertical mesh lines
+      for (let i = 0; i < numNodesX; i++) {
+        meshLinesX.push(...reshapedXCoordinates[i], null);
+        meshLinesY.push(...reshapedYCoordinates[i], null);
+      }
+
+      // Create the data structure for the mesh lines
+      meshData = {
+        x: meshLinesX,
+        y: meshLinesY,
+        mode: "lines",
+        type: "scatter",
+        line: {
+          color: "palegoldenrod",
+          width: 1,
+        },
+        showlegend: false,
+      };
+    }
 
     // Set a fixed maximum window size for the plot
     let maxWindowWidth = Math.min(window.innerWidth, 700);
@@ -88,14 +120,18 @@ export function plotSolution(
 
     // Set the layout for the contour plot
     let layout = {
-      title: `${plotType} plot - ${solverConfig}`,
+      title: `${plotType} plot${showMesh ? ' with mesh' : ''} - ${solverConfig}`,
       width: plotWidth,
       height: plotHeight,
       xaxis: { title: "x" },
       yaxis: { title: "y" },
     };
 
-    // Create the contour plot using Plotly
-    Plotly.newPlot(plotDivId, data, layout);
+    // Create the plot using Plotly
+    let plotData = [contourData];
+    if (showMesh) {
+      plotData.push(meshData);
+    }
+    Plotly.newPlot(plotDivId, plotData, layout);
   }
 }