FEAScript
diff --git a/‎examples/heatConductionScript/heatConduction2DFin/HeatConduction2DFinCG.html‎
Lines changed: 96 additions & 0 deletions b/‎examples/heatConductionScript/heatConduction2DFin/HeatConduction2DFinCG.html‎
Lines changed: 96 additions & 0 deletions
@@ -0,0 +1,96 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Heat Conduction 2D Fin - CG Solver</title>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/mathjs/5.0.0/math.min.js"></script>
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/plotly.js/2.27.0/plotly.min.js"></script>
+    <style>
+        body { font-family: Arial, sans-serif; max-width: 1200px; margin: 0 auto; padding: 20px; }
+        .result { background-color: #f5f5f5; padding: 10px; margin: 10px 0; border-radius: 3px; }
+        .success { color: green; }
+        .error { color: red; }
+    </style>
+</head>
+<body>
+    <h1>Heat Conduction in 2D Fin - Conjugate Gradient Solver</h1>
+    <div id="solutionPlot"></div>
+    <div id="result" class="result"></div>
+
+    <script type="module">
+        import { FEAScriptModel, plotSolution } from "../../../src/index.js";
+        import * as Comlink from '../../../src/vendor/comlink.mjs';
+
+        window.addEventListener("DOMContentLoaded", async () => {
+            
+
+            // Create a new FEAScript model
+            const model = new FEAScriptModel();
+
+            // Set solver configuration
+            model.setSolverConfig("solidHeatTransferScript");
+
+            // Define mesh configuration
+            model.setMeshConfig({
+                meshDimension: "2D",
+                elementOrder: "quadratic",
+                numElementsX: 40,
+                numElementsY: 20,
+                maxX: 4000,
+                maxY: 2000,
+            });
+
+            // Define boundary conditions
+            model.addBoundaryCondition("0", ["constantTemp", 200]);
+            model.addBoundaryCondition("1", ["symmetry"]);
+            model.addBoundaryCondition("2", ["convection", 1, 20]);
+            model.addBoundaryCondition("3", ["constantTemp", 200]);
+
+            // Initialize WebGPU worker
+            const worker = new Worker('../../../src/workers/webgpuComputeWorker.js', { type: 'module' });
+            const computeEngine = Comlink.wrap(worker);
+            await computeEngine.initialize();
+
+            const resultDiv = document.getElementById('result');
+            resultDiv.innerHTML = 'Assembling system and solving with GPU CG...';
+
+            try {
+                // Solve using FEAScriptModel with WebGPU CG
+                const { solutionVector, nodesCoordinates } = await model.solveWithWebGPU(computeEngine);
+
+                // Compute residual for verification
+                const A = []; // We don't have direct access to the assembled matrix, but we can compute residual norm
+                const b = []; // Similarly for RHS
+                // For now, just show that we got a solution
+                const n = solutionVector.length;
+
+                // Display results
+                resultDiv.innerHTML = `
+                    <div>System size: ${n} x ${n}</div>
+                    <div>Solution computed with WebGPU CG</div>
+                    <div class="success">✓ SOLUTION COMPLETED</div>
+                `;
+
+                // Plot the solution using FEAScript's plotSolution function
+                plotSolution(
+                    solutionVector,
+                    nodesCoordinates,
+                    model.solverConfig,
+                    model.meshConfig.meshDimension,
+                    "contour",
+                    "solutionPlot"
+                );
+
+                // Cleanup
+                await computeEngine.destroy();
+                worker.terminate();
+
+            } catch (error) {
+                resultDiv.innerHTML = `<span class="error">Error: ${error.message}</span>`;
+                console.error(error);
+            }
+        });
+    </script>
+</body>
+</html>