Spaces:
Sleeping
Sleeping
Update templates/output.html
Browse files- templates/output.html +41 -0
templates/output.html
CHANGED
|
@@ -2,6 +2,8 @@
|
|
| 2 |
<html lang="en">
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
|
|
|
|
|
|
| 5 |
<title>Report Viewer</title>
|
| 6 |
<style>
|
| 7 |
body {
|
|
@@ -98,6 +100,45 @@
|
|
| 98 |
{{ table_html | safe }}
|
| 99 |
</div>
|
| 100 |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
| 101 |
<!-- Pagination Controls -->
|
| 102 |
<div class="pagination">
|
| 103 |
{% if has_prev %}
|
|
|
|
| 2 |
<html lang="en">
|
| 3 |
<head>
|
| 4 |
<meta charset="UTF-8">
|
| 5 |
+
<!-- Add Plotly.js CDN in <head> -->
|
| 6 |
+
<script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
|
| 7 |
<title>Report Viewer</title>
|
| 8 |
<style>
|
| 9 |
body {
|
|
|
|
| 100 |
{{ table_html | safe }}
|
| 101 |
</div>
|
| 102 |
|
| 103 |
+
<!-- Chart Section -->
|
| 104 |
+
<div class="table-wrapper" style="margin-top: 30px;">
|
| 105 |
+
<h2 style="color:#ECB365;">Makable Predicted & Diff vs EngCts</h2>
|
| 106 |
+
<div id="line-chart" style="height: 400px;"></div>
|
| 107 |
+
</div>
|
| 108 |
+
|
| 109 |
+
<script>
|
| 110 |
+
const chartData = {{ chart_data | safe }};
|
| 111 |
+
|
| 112 |
+
const trace1 = {
|
| 113 |
+
x: chartData.EngCts,
|
| 114 |
+
y: chartData.Makable_Predicted,
|
| 115 |
+
type: 'scatter',
|
| 116 |
+
mode: 'lines+markers',
|
| 117 |
+
name: 'Makable_Predicted',
|
| 118 |
+
line: { color: '#00BFFF' }
|
| 119 |
+
};
|
| 120 |
+
|
| 121 |
+
const trace2 = {
|
| 122 |
+
x: chartData.EngCts,
|
| 123 |
+
y: chartData.Makable_Diff,
|
| 124 |
+
type: 'scatter',
|
| 125 |
+
mode: 'lines+markers',
|
| 126 |
+
name: 'Makable_Diff',
|
| 127 |
+
line: { color: '#FF6347' }
|
| 128 |
+
};
|
| 129 |
+
|
| 130 |
+
const layout = {
|
| 131 |
+
paper_bgcolor: "#04293A",
|
| 132 |
+
plot_bgcolor: "#041C32",
|
| 133 |
+
font: { color: "#ECB365" },
|
| 134 |
+
xaxis: { title: "EngCts" },
|
| 135 |
+
yaxis: { title: "Values" },
|
| 136 |
+
margin: { t: 40, l: 50, r: 30, b: 50 }
|
| 137 |
+
};
|
| 138 |
+
|
| 139 |
+
Plotly.newPlot('line-chart', [trace1, trace2], layout);
|
| 140 |
+
</script>
|
| 141 |
+
|
| 142 |
<!-- Pagination Controls -->
|
| 143 |
<div class="pagination">
|
| 144 |
{% if has_prev %}
|