Izmenjeni grafici za pregled rezultata treniranja i omogućeno vraćanje metrika backend-u.

9 files changed, 112 insertions, 64 deletions

diff --git a/backend/microservice/api/controller.py b/backend/microservice/api/controller.py
index 73f4ed31..7852b63d 100644
--- a/backend/microservice/api/controller.py
+++ b/backend/microservice/api/controller.py
@@ -69,7 +69,7 @@ def train():
     
 
     #dataset, paramsModel, paramsExperiment, callback)
-    filepath,result = newmlservice.train(data, paramsModel, paramsExperiment,paramsDataset, train_callback)
+    filepath,result,finalMetrics= newmlservice.train(data, paramsModel, paramsExperiment,paramsDataset, train_callback)
     """
     f = request.json['filepath']
     dataset = pd.read_csv(f)
@@ -77,6 +77,7 @@ def train():
     print(result)
     """
 
+
     url = config.api_url + "/file/h5"
     files = {'file': open(filepath, 'rb')}
     r=requests.post(url, files=files,data={"uploaderId":paramsExperiment['uploaderId']})
@@ -94,7 +95,9 @@ def train():
         "experimentId" : paramsExperiment["_id"],
         "modelId" : paramsModel["_id"],
         "h5FileId" : fileId,
-        "metrics" : m
+        "metrics" : m,
+        "finalMetrics":finalMetrics
+        
     }
     #print(predictor)
     url = config.api_url + "/Predictor/add"
diff --git a/backend/microservice/api/newmlservice.py b/backend/microservice/api/newmlservice.py
index 560e575f..0296828a 100644
--- a/backend/microservice/api/newmlservice.py
+++ b/backend/microservice/api/newmlservice.py
@@ -385,7 +385,7 @@ def train(dataset, paramsModel,paramsExperiment,paramsDataset,callback):
         #from ann_visualizer.visualize import ann_viz;
         #ann_viz(classifier, title="My neural network")
         
-        return filepath,hist
+        return filepath,hist,y_pred,y_test
 
     elif(problem_type=='binarni-klasifikacioni'):
         #print('*************************************************************************binarni')
@@ -425,31 +425,37 @@ def train(dataset, paramsModel,paramsExperiment,paramsDataset,callback):
         hist=history.history
         y_pred=classifier.predict(x_test)
         y_pred=(y_pred>=0.5).astype('int')
-
-        #print(y_pred.flatten())
-        #print(y_test)
         
         scores = classifier.evaluate(x_test, y_test)
         #print("\n%s: %.2f%%" % (classifier.metrics_names[1], scores[1]*100))
-        #
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
-        # 
         # ann_viz(classifier, title="My neural network")
         
         classifier.save(filepath, save_format='h5')
-        return filepath,hist
+
+        accuracy = float(sm.accuracy_score(y_test,y_pred))
+        precision = float(sm.precision_score(y_test,y_pred))
+        recall = float(sm.recall_score(y_test,y_pred))
+        tn, fp, fn, tp = sm.confusion_matrix(y_test,y_pred).ravel()
+        specificity = float(tn / (tn+fp))
+        f1 = float(sm.f1_score(y_test,y_pred))
+        fpr, tpr, _ = sm.roc_curve(y_test,y_pred)
+        logloss = float(sm.log_loss(y_test, y_pred))
+        metrics= {
+            "accuracy" : accuracy,
+            "precision" : precision,
+            "recall" : recall,
+            "specificity" : specificity,
+            "f1" : f1,
+            "tn" : float(tn),
+            "fp" : float(fp),
+            "fn" : float(fn),
+            "tp" : float(tp),
+            "fpr" : fpr.tolist(),
+            "tpr" : tpr.tolist(),
+            "logloss" : logloss
+            }
+
+        return filepath,hist,metrics
 
     elif(problem_type=='regresioni'):
         reg=paramsModel['layers'][0]['regularisation']
@@ -489,8 +495,32 @@ def train(dataset, paramsModel,paramsExperiment,paramsDataset,callback):
         hist=history.history
         y_pred=classifier.predict(x_test)
         #print(classifier.evaluate(x_test, y_test))
+ 
         classifier.save(filepath, save_format='h5')
-        return filepath,hist
+        
+
+        mse = float(sm.mean_squared_error(y_test,y_pred))
+        mae = float(sm.mean_absolute_error(y_test,y_pred))
+        mape = float(sm.mean_absolute_percentage_error(y_test,y_pred))
+        rmse = float(np.sqrt(sm.mean_squared_error(y_test,y_pred)))
+        rmsle = float(np.sqrt(sm.mean_squared_error(y_test, y_pred)))
+        r2 = float(sm.r2_score(y_test, y_pred))
+        # n - num of observations
+        # k - num of independent variables
+        n = 40
+        k = 2
+        adj_r2 = float(1 - ((1-r2)*(n-1)/(n-k-1)))
+        metrics= {"mse" : mse,
+            "mae" : mae,
+            "mape" : mape,
+            "rmse" : rmse,
+            "rmsle" : rmsle,
+            "r2" : r2,
+            "adj_r2" : adj_r2
+            }
+        
+        return filepath,hist,metrics
+
     def roc_auc_score_multiclass(actual_class, pred_class, average = "macro"):
     
         #creating a set of all the unique classes using the actual class list
@@ -514,29 +544,7 @@ def train(dataset, paramsModel,paramsExperiment,paramsDataset,callback):
     # Metrike
     #
     
-    if(problem_type=="binarni-klasifikacioni"):
-        accuracy = float(sm.accuracy_score(y_test,y_pred))
-        precision = float(sm.precision_score(y_test,y_pred))
-        recall = float(sm.recall_score(y_test,y_pred))
-        tn, fp, fn, tp = sm.confusion_matrix(y_test,y_pred).ravel()
-        specificity = float(tn / (tn+fp))
-        f1 = float(sm.f1_score(y_test,y_pred))
-        fpr, tpr, _ = sm.roc_curve(y_test,y_pred)
-        logloss = float(sm.log_loss(y_test, y_pred))
-        metrics= {"accuracy" : accuracy,
-            "precision" : precision,
-            "recall" : recall,
-            "specificity" : specificity,
-            "f1" : f1,
-            "tn" : float(tn),
-            "fp" : float(fp),
-            "fn" : float(fn),
-            "tp" : float(tp),
-            "fpr" : fpr.tolist(),
-            "tpr" : tpr.tolist(),
-            "logloss" : logloss
-            }
-    elif(problem_type=="regresioni"):
+    if(problem_type=="regresioni"):
         # https://www.analyticsvidhya.com/blog/2021/05/know-the-best-evaluation-metrics-for-your-regression-model/
         mse = float(sm.mean_squared_error(y_test,y_pred))
         mae = float(sm.mean_absolute_error(y_test,y_pred))
diff --git a/frontend/src/app/_elements/_charts/line-chart/line-chart.component.css b/frontend/src/app/_elements/_charts/line-chart/line-chart.component.css
index e69de29b..124b39e8 100644
--- a/frontend/src/app/_elements/_charts/line-chart/line-chart.component.css
+++ b/frontend/src/app/_elements/_charts/line-chart/line-chart.component.css
@@ -0,0 +1,9 @@
+canvas{
+
+    width:95% !important;
+    height:95% !important;
+    border: 1px solid var(--ns-primary);
+    background-color: var(--ns-bg-dark-100);
+    border-radius: 5px;
+    margin: 10px;
+  }
\ No newline at end of file
diff --git a/frontend/src/app/_elements/_charts/line-chart/line-chart.component.html b/frontend/src/app/_elements/_charts/line-chart/line-chart.component.html
index 7f18256a..6ffddd1f 100644
--- a/frontend/src/app/_elements/_charts/line-chart/line-chart.component.html
+++ b/frontend/src/app/_elements/_charts/line-chart/line-chart.component.html
@@ -1,3 +1,3 @@
 
-    <canvas  id="myChart" style="width: 100%; height: 530px;">   
+    <canvas  id="myChart" >   
     </canvas>
\ No newline at end of file
diff --git a/frontend/src/app/_elements/_charts/line-chart/line-chart.component.ts b/frontend/src/app/_elements/_charts/line-chart/line-chart.component.ts
index 655db9ec..9ead9232 100644
--- a/frontend/src/app/_elements/_charts/line-chart/line-chart.component.ts
+++ b/frontend/src/app/_elements/_charts/line-chart/line-chart.component.ts
@@ -54,9 +54,11 @@ export class LineChartComponent implements AfterViewInit {
         data: {
           labels: this.dataEpoch,
           datasets: [{
+
             label: 'Accuracy',
             data: this.dataAcc,
-            borderWidth: 1
+            borderWidth: 1,
+            
           },
           {
             label: 'Loss',
@@ -76,6 +78,20 @@ export class LineChartComponent implements AfterViewInit {
           ]
         },
         options: {
+          responsive: true,
+          maintainAspectRatio: true,
+
+          plugins: {
+            legend: {
+                labels: {
+                    // This more specific font property overrides the global property
+                    color:'white',
+                    font: {
+                      size: 11
+                  }
+                }
+            }
+          },
           scales: {
             x: {
               ticks: {
@@ -83,12 +99,13 @@ export class LineChartComponent implements AfterViewInit {
               },
               grid: {
                 color: "rgba(0, 99, 171, 0.5)"
-              }
+              },
             },
             y: {
               beginAtZero: true,
               ticks: {
                 color: 'white'
+              
               },
               grid: {
                 color: "rgba(0, 99, 171, 0.5)"
diff --git a/frontend/src/app/_elements/_charts/scatterchart/scatterchart.component.css b/frontend/src/app/_elements/_charts/scatterchart/scatterchart.component.css
index 005cb692..3e91b926 100644
--- a/frontend/src/app/_elements/_charts/scatterchart/scatterchart.component.css
+++ b/frontend/src/app/_elements/_charts/scatterchart/scatterchart.component.css
@@ -1,4 +1,8 @@
-#divScatterChart{
-
-    display: block;   
-}
\ No newline at end of file
+canvas{
+    width:95% !important;
+    height:95% !important;
+    border: 1px solid var(--ns-primary);
+    background-color: var(--ns-bg-dark-100);
+    border-radius: 5px;
+    margin: 10px;
+  }
\ No newline at end of file
diff --git a/frontend/src/app/_elements/_charts/scatterchart/scatterchart.component.html b/frontend/src/app/_elements/_charts/scatterchart/scatterchart.component.html
index ef41775a..eedc6ade 100644
--- a/frontend/src/app/_elements/_charts/scatterchart/scatterchart.component.html
+++ b/frontend/src/app/_elements/_charts/scatterchart/scatterchart.component.html
@@ -1,4 +1,2 @@
 
-<div id="divScatterChart" style="width: 100%;height: 100%;">
-    <canvas id="ScatterCharts" style="width: 100%;height: 280px;"> </canvas>
-</div>
\ No newline at end of file
+    <canvas id="ScatterCharts"> </canvas>
diff --git a/frontend/src/app/_elements/metric-view/metric-view.component.css b/frontend/src/app/_elements/metric-view/metric-view.component.css
index f91c1ccc..a59dd081 100644
--- a/frontend/src/app/_elements/metric-view/metric-view.component.css
+++ b/frontend/src/app/_elements/metric-view/metric-view.component.css
@@ -2,9 +2,18 @@
     width: 100%;
     height: 90%;
     border-radius: 5px;
-    background-color:var(--ns-primary-25);
-    border:1px solid var(--ns-accent);
+    border:1px solid var(--ns-primary);
+    display: table;
+    background-color: rgba(0, 65, 101, 0.7);
+    margin-top: 20px;
+}
+#left{
+    float: left;
+    width: 70% !important;
+    height: 100%;
+}
+#right{
+    float: right;
+    width: 30%;
+    height: 50%;
 }
-#line{
-    background-color:#dfd7d7f0 ;
-}
\ No newline at end of file
diff --git a/frontend/src/app/_elements/metric-view/metric-view.component.html b/frontend/src/app/_elements/metric-view/metric-view.component.html
index d72bc92b..b000c569 100644
--- a/frontend/src/app/_elements/metric-view/metric-view.component.html
+++ b/frontend/src/app/_elements/metric-view/metric-view.component.html
@@ -1,8 +1,8 @@
-<div id="container" class="d-flex justify-content-center flex-row w-100">
-    <div id="line" style="width: 100%;height: 100%;background-color:var(--ns-bg-dark-100);">
+<div id="container">
+    <div id="left">
         <app-line-chart></app-line-chart>
     </div>
-    <div style="background-color: var(--ns-bg-dark-100);width: 50%;height: 50%;">
+    <div id="right" >
         <app-scatterchart></app-scatterchart>
     </div>
 </div>
\ No newline at end of file