Added data to multibar chart

Signed-off-by: felix.gateru <[email protected]>

ui/web/static/js/charts.js

@@ -1022,6 +1022,37 @@ class MultiBarChart extends Echart {
         ]
     };
     multiBarChart.setOption(option);
+
+    async fetchDataAndUpdate() {
+      try {
+        const apiEndpoint = '/data?channel=${this.chartData.channel}';
+        const response = await fetch(apiEndpoint);
+  
+        if (!response.ok) {
+          throw new Error('API request failed with status ${response.status}');
+        }
+  
+        const data = await response.json();
+        updateChart(data);
+  
+      } catch (error) {
+        console.error("Error fetching data:", error);
+        // Handle the error (e.g., display an error message)
+      } finally {
+        // Schedule the next update
+        setTimeout(() => this.fetchDataAndUpdate(), 5000); // Example: 5 seconds 
+      }
+    }
+  
+    updateChart(data) {
+      const barChart = echarts.init(document.getElementById(this.ID));
+      const option = barChart.getOption(); // Get the existing options
+      
+      option.series[0].data = data.seriesData; 
+  
+      barChart.setOption(option); // Update the chart
+    }
+  }
   `;
   }
 }