Povezao metric view komponentu, chart, sa signalR tako da se iscrtavaju metrike modela kako se trenira. Ispravio neke bug-ove.

1 files changed, 68 insertions, 19 deletions

diff --git a/frontend/src/app/_elements/line-chart/line-chart.component.ts b/frontend/src/app/_elements/line-chart/line-chart.component.ts
index 68663861..1a8579a0 100644
--- a/frontend/src/app/_elements/line-chart/line-chart.component.ts
+++ b/frontend/src/app/_elements/line-chart/line-chart.component.ts
@@ -1,6 +1,6 @@
-import { Component, OnInit,Input } from '@angular/core';
-import { BaseChartDirective } from 'ng2-charts';
-import {Chart} from 'chart.js';
+import { Component, OnInit, Input } from '@angular/core';
+import { Chart } from 'chart.js';
+
 @Component({
   selector: 'app-line-chart',
   templateUrl: './line-chart.component.html',
@@ -8,32 +8,81 @@ import {Chart} from 'chart.js';
 })
 
 export class LineChartComponent implements OnInit {
-  @Input() dataAcc=[] ;
-  @Input() dataEpoch=[];
-  constructor() { }
+
+  dataAcc: number[] = [];
+  dataMAE: number[] = [];
+  dataMSE: number[] = [];
+  dataLOSS: number[] = [];
+
+  dataEpoch: number[] = [];
+
+  constructor() {
+    /*let i = 0;
+    setInterval(() => {
+      this.dataAcc.push(0.5);
+      this.dataEpoch.push(i);
+      i++;
+      this.update();
+    }, 200);*/
+  }
+
+  myChart!: Chart;
+
+  update(myEpochs: number[], myAcc: number[], myLoss: number[], myMae: number[], myMse: number[]) {
+    this.dataAcc.length = 0;
+    this.dataAcc.push(...myAcc);
+
+    this.dataEpoch.length = 0;
+    this.dataEpoch.push(...myEpochs);
+
+    this.dataMAE.length = 0;
+    this.dataMAE.push(...myMae);
+
+    this.dataLOSS.length = 0;
+    this.dataLOSS.push(...myLoss);
+
+    this.dataMSE.length = 0;
+    this.dataMSE.push(...myMse);
+
+    this.myChart.update();
+  }
 
   ngOnInit(): void {
-    var myChart=new Chart("myChart",
+    this.myChart = new Chart("myChart",
       {
         type: 'line',
-    data: {
-        labels:this.dataEpoch,
-        datasets: [{
-            label: 'Vrednost',
+        data: {
+          labels: this.dataEpoch,
+          datasets: [{
+            label: 'Accuracy',
             data: this.dataAcc,
             borderWidth: 1
-        }]
-    },
-    options: {
-        scales: {
+          },
+          {
+            label: 'Loss',
+            data: this.dataLOSS,
+            borderWidth: 1
+          },
+          {
+            label: 'MAE',
+            data: this.dataMAE,
+            borderWidth: 1
+          },
+          {
+            label: 'MSE',
+            data: this.dataMSE,
+            borderWidth: 1
+          }
+          ]
+        },
+        options: {
+          scales: {
             y: {
-                beginAtZero: true
+              beginAtZero: true
             }
+          }
         }
-    }
       }
     );
- 
   }
 }
- 
\ No newline at end of file