AdityaLab · Showmick119 · Feb 13, 2025 · Feb 13, 2025 · Feb 13, 2025 · Feb 13, 2025
diff --git a/docs/benchmark_visualizations/All_Benchmarks_Comparison.png b/docs/benchmark_visualizations/All_Benchmarks_Comparison.png
diff --git a/docs/benchmark_visualizations/ETT1_performance.png b/docs/benchmark_visualizations/ETT1_performance.png
diff --git a/docs/benchmark_visualizations/ETT2_performance.png b/docs/benchmark_visualizations/ETT2_performance.png
diff --git a/docs/benchmark_visualizations/Flu-Japan_performance.png b/docs/benchmark_visualizations/Flu-Japan_performance.png
diff --git a/docs/benchmark_visualizations/Flu-US_performance.png b/docs/benchmark_visualizations/Flu-US_performance.png
diff --git a/docs/benchmark_visualizations/M4_performance.png b/docs/benchmark_visualizations/M4_performance.png
diff --git a/docs/benchmark_visualizations/NY-Bike Demand_performance.png b/docs/benchmark_visualizations/NY-Bike Demand_performance.png
diff --git a/docs/benchmark_visualizations/NY-Taxi Demand_performance.png b/docs/benchmark_visualizations/NY-Taxi Demand_performance.png
diff --git a/docs/benchmark_visualizations/Nasdaq_performance.png b/docs/benchmark_visualizations/Nasdaq_performance.png
diff --git a/docs/benchmark_visualizations/PEM-Bays_performance.png b/docs/benchmark_visualizations/PEM-Bays_performance.png
diff --git a/docs/index.html b/docs/index.html
@@ -5,11 +5,71 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
     <title>Foundational Models for Time-series Analysis</title>
     <style>
-        body { font-family: Arial, sans-serif; margin: 40px; padding: 20px; background-color: #f4f4f4; }
+        body { font-family: Cambria, Cochin, Georgia, Times, 'Times New Roman', serif; margin: 40px; padding: 20px; background-color: #f4f4f4; }
         h1, h2, h3 { color: #333; }
-        .container { max-width: 800px; margin: auto; background: white; padding: 20px; border-radius: 8px; }
+        .container, .visualization-container {
+            max-width: 800px;
+            margin: auto;
+            background: white;
+            padding: 20px;
+            border-radius: 8px;
+            border: 2px solid #ccc;
+            box-shadow: 2px 2px 12px rgba(0, 0, 0, 0.1);
+        }
+        .container {
+            margin-bottom: 20px;
+        }
         table { border-collapse: collapse; width: 100%; }
         table, th, td { border: 1px solid black; padding: 8px; text-align: left; }
+        .visualization-container {
+            text-align: center;
+        }
+        .visualization-container label {
+            display: block;
+            margin-top: 15px;
+        }
+        .visualization-container select {
+            display: block;
+            margin: 10px auto;
+            padding: 8px 12px;
+            border-radius: 5px;
+            border: 1px solid #ccc;
+        }
+        .visualization-container .button-container {
+            text-align: center;
+            margin-top: 20px;
+
+        }
+        .visualization-container button {
+            margin-top: 15px;
+            margin-bottom: 10px;
+            padding: 10px 20px;
+            font-size: 16px;
+            cursor: pointer;
+            border: 1px solid #ccc;
+            background-color: #f8f9fa;
+            color: black;
+            border-radius: 5px;
+        }
+        .visualization-container button:hover {
+            background-color: #e2e6ea;
+        }
+        .visualization-container h2 {
+            text-align: center;
+        }
+        .visualization-container img {
+            width: 750px;
+            margin-top: 20px;
+            margin-bottom: 15px;
+            display: none;
+            margin-left: auto;
+            margin-right: auto;
+            display: block;
+            max-width: 100%;
+            border: 2px solid #ccc;
+            padding: 5px;
+            border-radius: 8px;
+        }
     </style>
 </head>
 <body>
@@ -18,10 +78,12 @@ <h1>Foundational Models for Time-series Analysis</h1>
         <h2>Introduction</h2>
         <p>Time-series analysis is a statistical technique used to analyze data points collected or recorded at specific time intervals. Unlike traditional data analysis, time-series methods focus on capturing temporal patterns, trends, seasonality, and cyclic behaviors in data. These insights help predict future values, enabling informed decision-making. Time-series analysis is widely employed in numerous industries due to its ability to leverage historical data for forecasting and strategic planning.
         Time-series analysis is widely used across industries for its predictive power. In finance, it supports stock price prediction and risk management. Retailers and e-commerce platforms leverage it for demand forecasting and inventory optimization, while healthcare uses it for monitoring patient trends and predicting outbreaks. Additionally, energy providers rely on it for consumption forecasting, and logistics companies use it to optimize routes and delivery schedules.</p>
-        <div style="display: flex; justify-content: center; padding-top: 5px; padding-bottom: 15px;">
+
+        <!-- Relevant Image For the Introduction -->
+        <!-- <div style="display: flex; justify-content: center; padding-top: 5px; padding-bottom: 15px;">
             <img src="img/sample_visual.png" alt="Sample Image highlighting the difference in performance between statistical models and foundational models" width="630px" height="320px">
         </div>
-        <p style="text-align: center; font-size: 15px;">Foundational models perform more effectively and efficiently in comparison to standard statistical models.</p>
+        <p style="text-align: center; font-size: 15px;">Foundational models perform more effectively and efficiently in comparison to standard statistical models.</p> -->
 
         <h2>Key Challenges in Real-World Deployment</h2>
         <h3>Simple Models are not enough</h1>
@@ -132,6 +194,14 @@ <h2>Comparison with other Foundational Models</h2>
             </tr>
         </table>
 
+        <h3>Visual Comparison With Other Foundational Models</h3>
+        <div style="display: flex; justify-content: center; padding-top: 10px; padding-bottom: 20px;">
+            <div style="border: 2px solid #ccc; padding: 10px; border-radius: 8px; background-color: #f9f9f9; box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);">
+                <img src="benchmark_visualizations/All_Benchmarks_Comparison.png" alt="Benchmark Comparison" width="750px" height="450px">
+            </div>
+        </div>
+
+
         <h2>Scalability with Model Size</h2>
         <p>LPTM is also much smaller at around 150 million parameters compared to other solutions that range from 500 million to 2 billion parameters. This allows LPTM to deployed at a wider range of low resource computing platforms and can be deployed at a in settings with requirements of lowers latency and high throughput applications such as finance and sales forecasting.</p>
 
@@ -141,5 +211,55 @@ <h2>Next Steps</h3>
             <li>Find Applications for our Foundational Time-Series Analysis Models</li>
         </ul>
     </div>
+
+    <div class="visualization-container">
+        <h2>Visualize Model Results</h2>
+        <label for="model-select">Choose a Model:</label>
+        <select id="model-select">
+            <option value="TimesFM">TimesFM</option>
+            <option value="LPTM">LPTM</option>
+            <option value="Chronos">Chronos</option>
+            <option value="Moment_Imputation">Moment Imputation</option>
+            <option value="Moment_Forecasting">Moment Forecasting</option>
+            <option value="Moment_Anomaly">Moment Anomaly Detection</option>
+        </select>
+
+        <label for="dataset-select">Choose a Dataset:</label>
+        <select id="dataset-select">
+            <option value="198_UCR_Anomaly">198_UCR_Anomaly_tiltAPB2_50000_124159_124985.out</option>
+            <option value="ECG5000">ECG5000</option>
+            <option value="ETTh1">ETTh1</option>
+        </select>
+
+        <button id="visualize-btn">Visualize Results</button>
+
+        <div id="visualization-result" class="result-container">
+            <img id="TimesFM-img" src="model_visualizations/timesfm_finetuned.png" alt="TimesFM Visualization">
+            <img id="LPTM-img" src="model_visualizations/lptm_finetuned.png" alt="LPTM Visualization">
+            <img id="Chronos-img" src="model_visualizations/chronos_finetuned.png" alt="Chronos Visualization">
+            <img id="Moment_Imputation-img" src="model_visualizations/momentimputation_finetuned.png" alt="Moment Imputation Visualization">
+            <img id="Moment_Forecasting-img" src="model_visualizations/momentforecasting_finetuned.png" alt="Moment Forecasting Visualization">
+            <img id="Moment_Anomaly-img" src="model_visualizations/momentanomalydetection_finetuned.png" alt="Moment Anomaly Detection Visualization">
+        </div>          
+    </div>
+
+    <script>
+        window.onload = function () {
+            let allImages = document.querySelectorAll("#visualization-result img");
+            allImages.forEach(img => img.style.display = "none");
+        };
+
+        document.getElementById("visualize-btn").addEventListener("click", function() {
+            let selectedModel = document.getElementById("model-select").value;
+            let allImages = document.querySelectorAll("#visualization-result img");
+
+            allImages.forEach(img => img.style.display = "none");
+
+            let selectedImage = document.getElementById(`${selectedModel}-img`);
+            if (selectedImage) {
+                selectedImage.style.display = "block";
+            }
+        });
+    </script>
 </body>
 </html>
diff --git a/docs/model_visualizations/chronos_finetuned.png b/docs/model_visualizations/chronos_finetuned.png
diff --git a/docs/model_visualizations/chronos_zeroshot.png b/docs/model_visualizations/chronos_zeroshot.png
diff --git a/docs/model_visualizations/lptm_finetuned.png b/docs/model_visualizations/lptm_finetuned.png
diff --git a/docs/model_visualizations/momentanomalydetection_finetuned.png b/docs/model_visualizations/momentanomalydetection_finetuned.png
diff --git a/docs/model_visualizations/momentanomalydetection_zeroshot.png b/docs/model_visualizations/momentanomalydetection_zeroshot.png
diff --git a/docs/model_visualizations/momentclassification_zeroshot.png b/docs/model_visualizations/momentclassification_zeroshot.png
diff --git a/docs/model_visualizations/momentforecasting_finetuned.png b/docs/model_visualizations/momentforecasting_finetuned.png
diff --git a/docs/model_visualizations/momentimputation_finetuned.png b/docs/model_visualizations/momentimputation_finetuned.png
diff --git a/docs/model_visualizations/timesfm_finetuned.png b/docs/model_visualizations/timesfm_finetuned.png
diff --git a/docs/model_visualizations/timesfm_zeroshot.png b/docs/model_visualizations/timesfm_zeroshot.png