From 8392d3cf8ba8cdecc7676e2e3d55edae11c048ef Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Wed, 13 Apr 2022 20:56:09 +0200 Subject: Sredjen izgled stranica "Napravi eksperiment" i "Treniraj model", kao i komponenti model-load i dataset-load. Kod dodavanja modela, postavljeno da sve metrike budu automatski cekirane. --- .../dataset-load/dataset-load.component.css | 5 + .../dataset-load/dataset-load.component.html | 23 +- .../_elements/model-load/model-load.component.css | 4 + .../_elements/model-load/model-load.component.html | 82 ++-- .../src/app/experiment/experiment.component.css | 4 + .../src/app/experiment/experiment.component.html | 427 ++++++++++----------- .../src/app/experiment/experiment.component.ts | 6 - frontend/src/app/training/training.component.html | 70 ++-- frontend/src/app/training/training.component.ts | 4 +- 9 files changed, 295 insertions(+), 330 deletions(-) (limited to 'frontend/src/app') diff --git a/frontend/src/app/_elements/dataset-load/dataset-load.component.css b/frontend/src/app/_elements/dataset-load/dataset-load.component.css index 54e0738e..ff6e2750 100644 --- a/frontend/src/app/_elements/dataset-load/dataset-load.component.css +++ b/frontend/src/app/_elements/dataset-load/dataset-load.component.css @@ -1,11 +1,16 @@ .btnType1 { background-color: #003459; color: white; + padding-top: 2vh; + padding-bottom: 2vh; } .btnType2 { background-color: white; color: #003459; border-color: #003459; + padding-top: 2vh; + padding-bottom: 2vh; + } .selectedDatasetClass { /*border-color: 2px solid #003459;*/ diff --git a/frontend/src/app/_elements/dataset-load/dataset-load.component.html b/frontend/src/app/_elements/dataset-load/dataset-load.component.html index 6ab58021..56a3b3c9 100644 --- a/frontend/src/app/_elements/dataset-load/dataset-load.component.html +++ b/frontend/src/app/_elements/dataset-load/dataset-load.component.html @@ -2,19 +2,18 @@ -
-
+
+ +

ili

+
- -

ili

- -
+
diff --git a/frontend/src/app/_elements/model-load/model-load.component.css b/frontend/src/app/_elements/model-load/model-load.component.css index 8e9a66f6..c716f964 100644 --- a/frontend/src/app/_elements/model-load/model-load.component.css +++ b/frontend/src/app/_elements/model-load/model-load.component.css @@ -1,11 +1,15 @@ .btnType1 { background-color: #003459; color: white; + padding-top: 2vh; + padding-bottom: 2vh; } .btnType2 { background-color: white; color: #003459; border-color: #003459; + padding-top: 2vh; + padding-bottom: 2vh; } .selectedModelClass { /*border-color: 2px solid #003459;*/ diff --git a/frontend/src/app/_elements/model-load/model-load.component.html b/frontend/src/app/_elements/model-load/model-load.component.html index 833b7181..f40ea476 100644 --- a/frontend/src/app/_elements/model-load/model-load.component.html +++ b/frontend/src/app/_elements/model-load/model-load.component.html @@ -1,7 +1,5 @@
-
-
-
+
-
+
@@ -51,11 +49,11 @@ value="{{newModel.dateCreated | date: 'dd/MM/yyyy'}}" readonly>
-

Parametri treniranja:

+

Parametri treniranja modela:

+
-
-
+
@@ -69,8 +67,7 @@
-
-
+
@@ -82,20 +79,6 @@
-
-
-
-
-
-
- -
-
- -
-
-
@@ -114,15 +97,16 @@
- +
- +
+
-
-
+
@@ -137,17 +121,27 @@
+
+ +
+
+ +
+
+ +
+
-

Aktivacione funkcije:

-
+

Aktivacione funkcije:

+ +
+
+ style="text-align: center;">Funkcija aktivacije
skrivenih slojeva:
-
+
@@ -164,13 +158,12 @@
-
+
+
+ style="text-align: center;">Funkcija aktivacije
izlaznog sloja:
-
+
+ id="metrics_{{option}}" style="float: left;" checked>
- -
+ +
+
+ + + + +
+ +
+
+
+ +
+
+
diff --git a/frontend/src/app/experiment/experiment.component.ts b/frontend/src/app/experiment/experiment.component.ts index 8a1b7d70..a2b5602b 100644 --- a/frontend/src/app/experiment/experiment.component.ts +++ b/frontend/src/app/experiment/experiment.component.ts @@ -24,7 +24,6 @@ export class ExperimentComponent implements OnInit { Object = Object; selectedColumnsInfoArray: ColumnInfo[] = []; - //selectedOutputColumnVal: string = ''; selectedNullColumnsArray: string[] = []; tempTestSetDistribution = 90; @@ -35,11 +34,9 @@ export class ExperimentComponent implements OnInit { } updateDataset(dataset: Dataset) { - //console.log(dataset); this.selectedDataset = dataset; this.selectedColumnsInfoArray = this.selectedDataset.columnInfo; this.selectedNullColumnsArray = []; - //console.log("array:", this.selectedColumnsInfoArray); } getInputById(id: string): HTMLInputElement { @@ -151,7 +148,6 @@ export class ExperimentComponent implements OnInit { } } } - //console.log(array); return array; } @@ -177,8 +173,6 @@ export class ExperimentComponent implements OnInit { for (let i = 0; i < pom.length; i++) this.experiment.inputColumns.push(pom[i].columnName); - //this.experiment.outputColumn = this.selectedOutputColumnVal; - this.selectedColumnsInfoArray = this.selectedColumnsInfoArray.filter(x => x.numNulls > 0); //obavezno this.experiment.nullValuesReplacers = this.getNullValuesReplacersArray(); diff --git a/frontend/src/app/training/training.component.html b/frontend/src/app/training/training.component.html index 2e574c12..0ce4cc89 100644 --- a/frontend/src/app/training/training.component.html +++ b/frontend/src/app/training/training.component.html @@ -1,38 +1,46 @@ -
-
+
+
+
-

1. Izaberite eksperiment iz kolekcije

-
- -
-
-
    -
  • - -
  • -
-
+
-

2.Izaberite model

- +

1. Izaberite eksperiment iz kolekcije

+
+ +
+
+
    +
  • + +
  • +
+
+ +

2. Izaberite model

+ + +

3. Treniranje modela

-

3. Trenirajte model

- +
+ +
+ +

Rezultati treniranja

+
+

Rezultati treniranja:

+

+ {{trainingResult}} +

+
+
-

Rezultati treniranja

-
-

Rezultati treniranja:

-

- {{trainingResult}} -

-
- -
+
+
\ No newline at end of file diff --git a/frontend/src/app/training/training.component.ts b/frontend/src/app/training/training.component.ts index 4f20bc87..027d2c22 100644 --- a/frontend/src/app/training/training.component.ts +++ b/frontend/src/app/training/training.component.ts @@ -24,7 +24,6 @@ export class TrainingComponent{ constructor(private modelsService: ModelsService, private datasetsService: DatasetsService, private experimentsService: ExperimentsService) { this.experimentsService.getMyExperiments().subscribe((experiments) => { this.myExperiments = experiments; - console.log(this.myExperiments); }); } @@ -48,7 +47,8 @@ export class TrainingComponent{ return; } this.modelsService.trainModel(this.selectedModel._id, this.selectedExperiment._id).subscribe((response: any) => { - console.log('Train model complete!', response); + //console.log('Train model complete!', response); + Shared.openDialog("Obaveštenje", "Treniranje modela je uspešno završeno!"); this.trainingResult = response; }); } -- cgit v1.2.3