Update templates/output.html

templates/output.html

@@ -105,8 +105,9 @@
       <h2 style="color:#ECB365;">Makable Predicted & Diff vs EngCts</h2>
       <div id="line-chart" style="height: 400px;"></div>
     </div>
-    
-    <script>
+
+    <!-- Line Chart with Markers -->
+    <!-- <script>
       const chartData = {{ chart_data | safe }};
       
       const trace1 = {
@@ -136,9 +137,44 @@
         margin: { t: 40, l: 50, r: 30, b: 50 }
       };
     
+      Plotly.newPlot('line-chart', [trace1, trace2], layout);
+    </script> -->
+
+    <!-- Dot Chart with Markers -->
+    <script>
+      const chartData = {{ chart_data | safe }};
+      
+      const trace1 = {
+        x: chartData.EngCts,
+        y: chartData.Makable_Predicted,
+        type: 'scatter',
+        mode: 'markers',  // Changed here
+        name: 'Makable_Predicted',
+        marker: { color: '#00BFFF' }
+      };
+    
+      const trace2 = {
+        x: chartData.EngCts,
+        y: chartData.Makable_Diff,
+        type: 'scatter',
+        mode: 'markers',  // Changed here
+        name: 'Makable_Diff',
+        marker: { color: '#FF6347' }
+      };
+    
+      const layout = {
+        paper_bgcolor: "#04293A",
+        plot_bgcolor: "#041C32",
+        font: { color: "#ECB365" },
+        xaxis: { title: "EngCts" },
+        yaxis: { title: "Values" },
+        margin: { t: 40, l: 50, r: 30, b: 50 }
+      };
+    
       Plotly.newPlot('line-chart', [trace1, trace2], layout);
     </script>
 
+
     <!-- Pagination Controls -->
     <div class="pagination">
       {% if has_prev %}