From cebddfe818f0519b3f57ef65c619d7d1d81783f7 Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Mon, 16 May 2022 17:14:00 +0200 Subject: Registracija: resen problem da jedan popup zakloni drugi (obavestenje ispod polja). Izmene u column-table. --- .../src/app/_elements/column-table/column-table.component.ts | 12 ++++++++++-- 1 file changed, 10 insertions(+), 2 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 217eda30..e9154cb3 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -235,13 +235,21 @@ export class ColumnTableComponent implements AfterViewInit { this.experiment.nullValues = NullValueOptions.DeleteColumns; this.experiment.nullValuesReplacers = []; for (let i = 0; i < this.experiment.inputColumns.length; i++) { - this.experiment.nullValuesReplacers.push({ + this.experiment.nullValuesReplacers.push({ //ovo zakomentarisano column: this.experiment.inputColumns[i], option: NullValueOptions.DeleteColumns, value: "" }); this.nullValOption[i] = "Obriši kolonu"; } + //obrisi kolone koje sadrze nedostajuce vrednosti iz input kolona + /*for (let i = 0; i < this.dataset.columnInfo.length; i++) { + if (this.dataset.columnInfo[i].numNulls > 0) { + this.experiment.inputColumns = this.experiment.inputColumns.filter(x => x != this.dataset!.columnInfo[i].columnName); + this.columnsChecked[i] = false; + console.log(this.dataset!.columnInfo[i].columnName); + } + }*/ } else if (selectedMissingValuesOption == NullValueOptions.DeleteRows) { this.experiment.nullValues = NullValueOptions.DeleteRows; @@ -261,7 +269,7 @@ export class ColumnTableComponent implements AfterViewInit { } openMissingValuesDialog() { const dialogRef = this.dialog.open(MissingvaluesDialogComponent, { - width: '400px' + width: '500px' }); dialogRef.afterClosed().subscribe(selectedMissingValuesOption => { if (selectedMissingValuesOption != undefined) -- cgit v1.2.3 From 61f21c866a2d6d95e65d5b61d0df8be865963262 Mon Sep 17 00:00:00 2001 From: Ognjen Cirkovic Date: Mon, 16 May 2022 22:39:03 +0200 Subject: Omogucen praging na tabeli koja se nalazi na stranici gde se kreira eksperiment. --- .../column-table/column-table.component.html | 6 ++++ .../column-table/column-table.component.ts | 36 +++++++++++++++++++--- 2 files changed, 37 insertions(+), 5 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.html b/frontend/src/app/_elements/column-table/column-table.component.html index 9aebf114..3256ffee 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -44,6 +44,12 @@ +
+ +
{{(this.begin/10)+1}}
+ + +
diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index e9154cb3..b160ab30 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -42,9 +42,30 @@ export class ColumnTableComponent implements AfterViewInit { loaded: boolean = false; + begin:number=0; + end:number=10; + + + constructor(private datasetService: DatasetsService, private experimentService: ExperimentsService, public csvParseService: CsvParseService, public dialog: MatDialog) { //ovo mi nece trebati jer primam dataset iz druge komponente } + resetPagging(){ + this.begin=0; + } + goBack(){ + if(this.begin-10<=0) + this.begin=0; + else + this.begin-=10; + this.loadData(); + + } + goForward(){ + this.begin+=10; + this.loadData(); + } + updateCharts() { //min: number, max: number, q1: number, q3: number, median: number @@ -90,16 +111,21 @@ export class ColumnTableComponent implements AfterViewInit { this.dataset.columnInfo.forEach(colInfo => { this.nullValOption.push(`Obriši redove (${colInfo.numNulls})`); }); + this.resetPagging(); + this.loadData(); + this.loaded = true; + + this.updateCharts(); + this.updatePieChart(); + } - this.datasetService.getDatasetFilePartial(this.dataset.fileId, 0, 10).subscribe((response: string | undefined) => { + loadData(){ + if(this.dataset!=undefined) + this.datasetService.getDatasetFilePartial(this.dataset.fileId, this.begin, this.end).subscribe((response: string | undefined) => { if (response && this.dataset != undefined) { this.tableData = this.csvParseService.csvToArray(response, (this.dataset.delimiter == "razmak") ? " " : (this.dataset.delimiter == "novi red") ? "\t" : this.dataset.delimiter); } }); - this.loaded = true; - - this.updateCharts(); - this.updatePieChart(); } ngAfterViewInit(): void { -- cgit v1.2.3 From f36899620a84cd1629b0d31a930f8bf8eb797d8b Mon Sep 17 00:00:00 2001 From: Ognjen Cirkovic Date: Tue, 17 May 2022 15:38:16 +0200 Subject: Promenjen naziv promenjive tako da ima vise smisla. --- frontend/src/app/_elements/column-table/column-table.component.ts | 4 ++-- frontend/src/app/_elements/form-dataset/form-dataset.component.ts | 4 ++-- 2 files changed, 4 insertions(+), 4 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index b160ab30..a3469d90 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -43,7 +43,7 @@ export class ColumnTableComponent implements AfterViewInit { begin:number=0; - end:number=10; + step:number=10; @@ -121,7 +121,7 @@ export class ColumnTableComponent implements AfterViewInit { loadData(){ if(this.dataset!=undefined) - this.datasetService.getDatasetFilePartial(this.dataset.fileId, this.begin, this.end).subscribe((response: string | undefined) => { + this.datasetService.getDatasetFilePartial(this.dataset.fileId, this.begin, this.step).subscribe((response: string | undefined) => { if (response && this.dataset != undefined) { this.tableData = this.csvParseService.csvToArray(response, (this.dataset.delimiter == "razmak") ? " " : (this.dataset.delimiter == "novi red") ? "\t" : this.dataset.delimiter); } diff --git a/frontend/src/app/_elements/form-dataset/form-dataset.component.ts b/frontend/src/app/_elements/form-dataset/form-dataset.component.ts index 79fbe2c9..d801b5fb 100644 --- a/frontend/src/app/_elements/form-dataset/form-dataset.component.ts +++ b/frontend/src/app/_elements/form-dataset/form-dataset.component.ts @@ -25,7 +25,7 @@ export class FormDatasetComponent { rowsNumber: number = 0; colsNumber: number = 0; begin:number=0; - end:number=10; + step:number=10; existingFlag:boolean=false; @Input() dataset: Dataset; //dodaj ! potencijalno @@ -115,7 +115,7 @@ export class FormDatasetComponent { this.tableData.loaded = false; this.datasetsService.getDatasetHeader(this.dataset.fileId).subscribe((header: string | undefined)=>{ - this.datasetsService.getDatasetFilePaging(this.dataset.fileId,this.begin,this.end).subscribe((file: string | undefined) => { + this.datasetsService.getDatasetFilePaging(this.dataset.fileId,this.begin,this.step).subscribe((file: string | undefined) => { if (file) { this.tableData.loaded = true; this.tableData.numRows = this.dataset.rowCount; -- cgit v1.2.3 From 0a5d881355a1011568f1ed3cb9b3b87f4e8dee14 Mon Sep 17 00:00:00 2001 From: Ognjen Cirkovic Date: Tue, 17 May 2022 21:41:42 +0200 Subject: Dodat broj stranica. Api poziv se odvija samo ako se prelazi na validnu stranu. --- .../_elements/column-table/column-table.component.html | 2 +- .../_elements/column-table/column-table.component.ts | 18 +++++++++++++++--- .../_elements/form-dataset/form-dataset.component.html | 2 +- .../_elements/form-dataset/form-dataset.component.ts | 14 +++++++++++--- 4 files changed, 28 insertions(+), 8 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.html b/frontend/src/app/_elements/column-table/column-table.component.html index 3256ffee..8a4164f1 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -46,7 +46,7 @@
-
{{(this.begin/10)+1}}
+
{{(this.begin/10)+1}}...{{getPage()}}
diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index a3469d90..ed2f0380 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -54,16 +54,28 @@ export class ColumnTableComponent implements AfterViewInit { this.begin=0; } goBack(){ - if(this.begin-10<=0) + if(this.begin-10<0) this.begin=0; else + { this.begin-=10; - this.loadData(); + this.loadData(); + } } goForward(){ + if(this.dataset!=undefined){ this.begin+=10; - this.loadData(); + if(this.dataset.rowCount
-
{{(this.begin/10)+1}}
+
{{(this.begin/10)+1}}...{{getPage()}}
diff --git a/frontend/src/app/_elements/form-dataset/form-dataset.component.ts b/frontend/src/app/_elements/form-dataset/form-dataset.component.ts index d801b5fb..19c0083c 100644 --- a/frontend/src/app/_elements/form-dataset/form-dataset.component.ts +++ b/frontend/src/app/_elements/form-dataset/form-dataset.component.ts @@ -47,20 +47,28 @@ export class FormDatasetComponent { this.begin=0; } goBack(){ - if(this.begin-10<=0) + if(this.begin-10<0) this.begin=0; else + { this.begin-=10; - this.loadExisting(); + this.loadExisting(); + } } goForward(){ this.begin+=10; - this.loadExisting(); + if(this.dataset.rowCount Date: Wed, 18 May 2022 13:52:29 +0200 Subject: Ispravljen bag: kad se izmeni dataset, refreshuje se 2. korak na eksperiment strani. Dodata ruta kako bi se eksperiment iz kolekcije otvorio na eksperiment strani. Sredjivanje otvaranja - pocetak --- .../api/api/Controllers/ExperimentController.cs | 2 +- .../column-table/column-table.component.html | 4 +- .../column-table/column-table.component.ts | 3 +- .../src/app/_elements/folder/folder.component.html | 6 +-- .../src/app/_elements/folder/folder.component.ts | 8 +++- .../app/_pages/experiment/experiment.component.ts | 44 +++++++++++++++++++--- frontend/src/app/_services/datasets.service.ts | 3 ++ frontend/src/app/_services/experiments.service.ts | 4 ++ frontend/src/app/app-routing.module.ts | 2 +- 9 files changed, 61 insertions(+), 15 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/backend/api/api/Controllers/ExperimentController.cs b/backend/api/api/Controllers/ExperimentController.cs index 08354615..b599ca4e 100644 --- a/backend/api/api/Controllers/ExperimentController.cs +++ b/backend/api/api/Controllers/ExperimentController.cs @@ -61,7 +61,7 @@ namespace api.Controllers return Ok(experiment); } - [HttpGet("get")] + [HttpGet("get/{id}")] [Authorize(Roles = "User,Guest")] public async Task> Get(string id) { diff --git a/frontend/src/app/_elements/column-table/column-table.component.html b/frontend/src/app/_elements/column-table/column-table.component.html index 3256ffee..8af56c43 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -45,10 +45,10 @@
- +
{{(this.begin/10)+1}}
- +
diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index a3469d90..7c2f8cef 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -41,14 +41,12 @@ export class ColumnTableComponent implements AfterViewInit { columnsChecked: boolean[] = []; //niz svih kolona loaded: boolean = false; - begin:number=0; step:number=10; constructor(private datasetService: DatasetsService, private experimentService: ExperimentsService, public csvParseService: CsvParseService, public dialog: MatDialog) { - //ovo mi nece trebati jer primam dataset iz druge komponente } resetPagging(){ this.begin=0; @@ -98,6 +96,7 @@ export class ColumnTableComponent implements AfterViewInit { this.dataset = dataset; this.setColumnTypeInitial(); + this.columnsChecked = []; this.dataset.columnInfo.forEach(column => { this.columnsChecked.push(true); }); diff --git a/frontend/src/app/_elements/folder/folder.component.html b/frontend/src/app/_elements/folder/folder.component.html index db4f28f0..84946697 100644 --- a/frontend/src/app/_elements/folder/folder.component.html +++ b/frontend/src/app/_elements/folder/folder.component.html @@ -78,12 +78,12 @@
+
- +
diff --git a/frontend/src/app/_elements/folder/folder.component.ts b/frontend/src/app/_elements/folder/folder.component.ts index d26ac999..4e2209a0 100644 --- a/frontend/src/app/_elements/folder/folder.component.ts +++ b/frontend/src/app/_elements/folder/folder.component.ts @@ -105,7 +105,7 @@ export class FolderComponent implements AfterViewInit { this.selectedFile = file; this.fileToDisplay = file; if (this.type == FolderType.Experiment && file) { - this.router.navigate(['/experiment'/*, file._id*/]) + this.router.navigate(['/experiment/', file._id]); } this.newFileSelected = false; this.listView = false; @@ -116,6 +116,12 @@ export class FolderComponent implements AfterViewInit { if (this.type == FolderType.Dataset) this.formDataset.loadExisting(); } + /* + goToExperimentPage(file: FolderFile) { + console.log(file); + //this.router.navigate(['/experiment/', this.experiment._id]); + } + */ createNewFile() { if (this.type == FolderType.Dataset) { diff --git a/frontend/src/app/_pages/experiment/experiment.component.ts b/frontend/src/app/_pages/experiment/experiment.component.ts index abf4b697..62ef9257 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.ts +++ b/frontend/src/app/_pages/experiment/experiment.component.ts @@ -1,4 +1,4 @@ -import { AfterViewInit, Component, ElementRef, ViewChild, ViewChildren, Input } from '@angular/core'; +import { AfterViewInit, Component, ElementRef, ViewChild, ViewChildren, Input, OnInit } from '@angular/core'; import { StepperSelectionEvent } from '@angular/cdk/stepper'; import { MatStepper } from '@angular/material/stepper'; import Shared from 'src/app/Shared'; @@ -12,13 +12,15 @@ import Dataset from 'src/app/_data/Dataset'; import { ColumnTableComponent } from 'src/app/_elements/column-table/column-table.component'; import { SignalRService } from 'src/app/_services/signal-r.service'; import { MetricViewComponent } from 'src/app/_elements/metric-view/metric-view.component'; +import { ActivatedRoute, Router } from '@angular/router'; +import { DatasetsService } from 'src/app/_services/datasets.service'; @Component({ selector: 'app-experiment', templateUrl: './experiment.component.html', styleUrls: ['./experiment.component.css'] }) -export class ExperimentComponent implements AfterViewInit { +export class ExperimentComponent implements AfterViewInit, OnInit { @ViewChild(MatStepper) stepper!: MatStepper; @ViewChild('stepsContainer') stepsContainer!: ElementRef; @@ -32,9 +34,36 @@ export class ExperimentComponent implements AfterViewInit { @ViewChild("folderModel") folderModel!: FolderComponent; @ViewChild("metricView") metricView!: MetricViewComponent; - constructor(private experimentsService: ExperimentsService, private modelsService: ModelsService, private signalRService: SignalRService) { + constructor(private experimentsService: ExperimentsService, private modelsService: ModelsService, private datasetsService: DatasetsService, private signalRService: SignalRService, private route: ActivatedRoute) { this.experiment = new Experiment("exp1"); } + ngOnInit(): void { + this.route.queryParams.subscribe(params => { + let experimentId = this.route.snapshot.paramMap.get("id"); + console.log("EXPID u exp.comp:", experimentId); + if (experimentId == null) + return; + + this.experimentsService.getExperimentById(experimentId).subscribe((response) => { + this.experiment = response; + console.log(this.experiment); //OTKUD MI NAME + this.datasetsService.getDatasetById(this.experiment.datasetId).subscribe((response: Dataset) => { + this.dataset = response; + console.log("EXP u exp.comp:", this.experiment); + console.log("DATASET u exp.comp:", this.dataset); + this.folderDataset.forExperiment = this.experiment; + this.folderDataset.fileToDisplay = this.experiment; + this.folderDataset.selectFile(); + this.columnTable.experiment = this.experiment; + this.columnTable.dataset = this.dataset; + //this.columnTable.loadDataset(this.dataset); + + //this.setDataset(); + //this.experimentChangedEvent(); + }); + }); + }); + } /*updateExperiment(){ @@ -151,13 +180,18 @@ export class ExperimentComponent implements AfterViewInit { this.folderModel.updateExperiment(); } - setDataset(dataset: FolderFile) { + setDataset(dataset: FolderFile | null) { + if (dataset == null) { + this.columnTable.loaded = false; + this.dataset = undefined; + this.experiment.datasetId = ''; + return; + } const d = dataset; this.experiment.datasetId = d._id; this.dataset = d; this.columnTable.loadDataset(this.dataset); - } modelToTrain?: Model; diff --git a/frontend/src/app/_services/datasets.service.ts b/frontend/src/app/_services/datasets.service.ts index 1b961442..11a6ee5e 100644 --- a/frontend/src/app/_services/datasets.service.ts +++ b/frontend/src/app/_services/datasets.service.ts @@ -40,6 +40,9 @@ export class DatasetsService { getDatasetFilePartial(fileId: any, startRow: number, rowNum: number): Observable { return this.http.get(`${Configuration.settings.apiURL}/file/csvRead/${fileId}/${startRow}/${rowNum}`, { headers: this.authService.authHeader(), responseType: 'text' }); } + getDatasetById(datasetId: string): Observable { + return this.http.get(`${Configuration.settings.apiURL}/dataset/${datasetId}`, { headers: this.authService.authHeader() }); + } editDataset(dataset: Dataset): Observable { return this.http.put(`${Configuration.settings.apiURL}/dataset/` + dataset._id, dataset, { headers: this.authService.authHeader() }); diff --git a/frontend/src/app/_services/experiments.service.ts b/frontend/src/app/_services/experiments.service.ts index 29569fca..f4473c8c 100644 --- a/frontend/src/app/_services/experiments.service.ts +++ b/frontend/src/app/_services/experiments.service.ts @@ -20,6 +20,10 @@ export class ExperimentsService { return this.http.get(`${Configuration.settings.apiURL}/experiment/getmyexperiments`, { headers: this.authService.authHeader() }); } + getExperimentById(id: string): Observable { + return this.http.get(`${Configuration.settings.apiURL}/experiment/get/${id}`, { headers: this.authService.authHeader() }); + } + updateExperiment(experiment: Experiment): Observable { return this.http.put(`${Configuration.settings.apiURL}/experiment/` + experiment._id, experiment, { headers: this.authService.authHeader() }); } diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index f5f1ccae..9f8c623d 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -12,11 +12,11 @@ import { TestComponent } from './_pages/test/test.component'; const routes: Routes = [ { path: '', component: HomeComponent, data: { title: 'Početna strana' } }, + { path: 'experiment/:id', component: ExperimentComponent, data: { title: 'Eksperiment' } }, { path: 'experiment', component: ExperimentComponent, data: { title: 'Eksperiment' } }, { path: 'archive', component: ArchiveComponent, data: { title: 'Arhiva' } }, { path: 'profile', component: ProfileComponent, canActivate: [AuthGuardService], data: { title: 'Profil' } }, { path: 'playground', component: PlaygroundComponent, data: { title: 'Zabava' } }, - { path: 'sonja', component: ColumnTableComponent }, { path: 'test', component: TestComponent, data: { title: 'Test' } } ]; -- cgit v1.2.3 From 2834795337f81e895c3b39948b5b04f7bc662071 Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Wed, 18 May 2022 17:22:09 +0200 Subject: Omogucen pristup glavnoj eksperiment strani odabirom eksperimenta iz kolekcije - automatski popunjeni prvi i drugi korak (forma za dataset i column-table). Korisnik moze da pocne od kreiranja modela (i prethodno izmeni sta zeli). --- .../column-table/column-table.component.ts | 65 +++++++++++++++------- .../src/app/_elements/folder/folder.component.ts | 5 +- .../app/_pages/experiment/experiment.component.ts | 16 +----- frontend/src/app/_services/datasets.service.ts | 2 +- 4 files changed, 52 insertions(+), 36 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 8824ecf4..9fdb6936 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -14,6 +14,7 @@ import { AlertDialogComponent } from 'src/app/_modals/alert-dialog/alert-dialog. import Shared from 'src/app/Shared'; import { PieChartComponent } from '../_charts/pie-chart/pie-chart.component'; import { BoxPlotComponent } from '../_charts/box-plot/box-plot.component'; +import { ActivatedRoute } from '@angular/router'; @Component({ selector: 'app-column-table', @@ -46,7 +47,7 @@ export class ColumnTableComponent implements AfterViewInit { - constructor(private datasetService: DatasetsService, private experimentService: ExperimentsService, public csvParseService: CsvParseService, public dialog: MatDialog) { + constructor(private datasetService: DatasetsService, private experimentService: ExperimentsService, public csvParseService: CsvParseService, public dialog: MatDialog, private route: ActivatedRoute) { } resetPagging(){ this.begin=0; @@ -105,23 +106,51 @@ export class ColumnTableComponent implements AfterViewInit { loadDataset(dataset: Dataset) { console.log("LOADED DATASET"); - this.dataset = dataset; - this.setColumnTypeInitial(); - this.columnsChecked = []; - this.dataset.columnInfo.forEach(column => { - this.columnsChecked.push(true); - }); - - this.resetInputColumns(); - this.resetOutputColumn(); - this.resetColumnEncodings(Encoding.Label); - this.setDeleteRowsForMissingValTreatment(); - - this.nullValOption = []; - this.dataset.columnInfo.forEach(colInfo => { - this.nullValOption.push(`Obriši redove (${colInfo.numNulls})`); - }); + if (this.route.snapshot.paramMap.get("id") == null) { + this.dataset = dataset; + this.setColumnTypeInitial(); + + this.columnsChecked = []; + this.dataset.columnInfo.forEach(column => { + this.columnsChecked.push(true); + }); + + this.resetInputColumns(); + this.resetOutputColumn(); + this.resetColumnEncodings(Encoding.Label); + this.setDeleteRowsForMissingValTreatment(); + + this.nullValOption = []; + this.dataset.columnInfo.forEach(colInfo => { + this.nullValOption.push(`Obriši redove (${colInfo.numNulls})`); + }); + } + else { + this.dataset = dataset; + this.columnsChecked = []; + this.dataset.columnInfo.forEach(column => { + if (this.experiment.inputColumns.find(x => x == column.columnName) != undefined) + this.columnsChecked.push(true); + else + this.columnsChecked.push(false); + }); + this.nullValOption = []; + for (let i = 0; i < this.dataset!.columnInfo.length; i++) { + let nullValRep = this.experiment.nullValuesReplacers.find(x => x.column == this.dataset!.columnInfo[i].columnName); + if (nullValRep != undefined) { + if (nullValRep.option == NullValueOptions.DeleteRows) + this.nullValOption.push(`Obriši redove (${this.dataset.columnInfo[i].numNulls})`); + else if (nullValRep.option == NullValueOptions.DeleteColumns) + this.nullValOption.push(`Obriši kolonu`); + else { + this.nullValOption.push(`Popuni sa ${nullValRep.value}`); + } + } + else + this.nullValOption.push(`Obriši redove (${this.dataset.columnInfo[i].numNulls})`); + } + } this.resetPagging(); this.loadData(); this.loaded = true; @@ -140,8 +169,6 @@ export class ColumnTableComponent implements AfterViewInit { } ngAfterViewInit(): void { - console.log(this.dataset?.columnInfo); - } setColumnTypeInitial() { diff --git a/frontend/src/app/_elements/folder/folder.component.ts b/frontend/src/app/_elements/folder/folder.component.ts index 4e2209a0..2b6f9aa7 100644 --- a/frontend/src/app/_elements/folder/folder.component.ts +++ b/frontend/src/app/_elements/folder/folder.component.ts @@ -11,7 +11,7 @@ import { ExperimentsService } from 'src/app/_services/experiments.service'; import { PredictorsService } from 'src/app/_services/predictors.service'; import { SignalRService } from 'src/app/_services/signal-r.service'; import { FormModelComponent } from '../form-model/form-model.component'; -import { Router } from '@angular/router'; +import { ActivatedRoute, Router } from '@angular/router'; import Predictor from 'src/app/_data/Predictor'; @Component({ @@ -42,11 +42,12 @@ export class FolderComponent implements AfterViewInit { fileToDisplay?: FolderFile; @Output() selectedFileChanged: EventEmitter = new EventEmitter(); + @Output() fileFromRoute: EventEmitter = new EventEmitter(); @Output() okPressed: EventEmitter = new EventEmitter(); searchTerm: string = ''; - constructor(private datasetsService: DatasetsService, private experimentsService: ExperimentsService, private modelsService: ModelsService, private predictorsService: PredictorsService, private signalRService: SignalRService, private router: Router) { + constructor(private datasetsService: DatasetsService, private experimentsService: ExperimentsService, private modelsService: ModelsService, private predictorsService: PredictorsService, private signalRService: SignalRService, private router: Router, private route: ActivatedRoute) { this.tabsToShow.forEach(tab => this.folders[tab] = []); } diff --git a/frontend/src/app/_pages/experiment/experiment.component.ts b/frontend/src/app/_pages/experiment/experiment.component.ts index 6345307c..9af2a305 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.ts +++ b/frontend/src/app/_pages/experiment/experiment.component.ts @@ -46,26 +46,15 @@ export class ExperimentComponent implements AfterViewInit, OnInit { ngOnInit(): void { this.route.queryParams.subscribe(params => { let experimentId = this.route.snapshot.paramMap.get("id"); - console.log("EXPID u exp.comp:", experimentId); if (experimentId == null) return; - this.experimentsService.getExperimentById(experimentId).subscribe((response) => { this.experiment = response; - console.log(this.experiment); //OTKUD MI NAME this.datasetsService.getDatasetById(this.experiment.datasetId).subscribe((response: Dataset) => { this.dataset = response; - console.log("EXP u exp.comp:", this.experiment); - console.log("DATASET u exp.comp:", this.dataset); + this.folderDataset.forExperiment = this.experiment; - this.folderDataset.fileToDisplay = this.experiment; - this.folderDataset.selectFile(); - this.columnTable.experiment = this.experiment; - this.columnTable.dataset = this.dataset; - //this.columnTable.loadDataset(this.dataset); - - //this.setDataset(); - //this.experimentChangedEvent(); + this.folderDataset.selectFile(this.dataset); }); }); }); @@ -200,7 +189,6 @@ export class ExperimentComponent implements AfterViewInit, OnInit { this.columnTable.loadDataset(this.dataset); this.step1=true; - } modelToTrain?: Model; diff --git a/frontend/src/app/_services/datasets.service.ts b/frontend/src/app/_services/datasets.service.ts index 11a6ee5e..8d07674d 100644 --- a/frontend/src/app/_services/datasets.service.ts +++ b/frontend/src/app/_services/datasets.service.ts @@ -41,7 +41,7 @@ export class DatasetsService { return this.http.get(`${Configuration.settings.apiURL}/file/csvRead/${fileId}/${startRow}/${rowNum}`, { headers: this.authService.authHeader(), responseType: 'text' }); } getDatasetById(datasetId: string): Observable { - return this.http.get(`${Configuration.settings.apiURL}/dataset/${datasetId}`, { headers: this.authService.authHeader() }); + return this.http.get(`${Configuration.settings.apiURL}/dataset/get/${datasetId}`, { headers: this.authService.authHeader() }); } editDataset(dataset: Dataset): Observable { -- cgit v1.2.3 From e719412e42581646a04cbd0ffa443be52d7740cf Mon Sep 17 00:00:00 2001 From: Nevena Bojovic Date: Wed, 18 May 2022 23:36:44 +0200 Subject: Grafici --- backend/api/api/appsettings.json | 8 ++-- .../_charts/pie-chart/pie-chart.component.ts | 43 +++++++++++++++------- .../column-table/column-table.component.ts | 11 ++++-- 3 files changed, 41 insertions(+), 21 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/backend/api/api/appsettings.json b/backend/api/api/appsettings.json index ec8f7dd8..44d63ac3 100644 --- a/backend/api/api/appsettings.json +++ b/backend/api/api/appsettings.json @@ -16,22 +16,22 @@ "UserStoreDatabaseSettings": { /* LocalHost*/ - "ConnectionString": "mongodb://127.0.0.1:27017/", + /*"ConnectionString": "mongodb://127.0.0.1:27017/", "DatabaseName": "si_project", "CollectionName": "users", "DatasetCollectionName": "Dataset", "ModelCollectionName": "Model", "PredictorCollectionName": "Predictor", "FilesCollectionName": "Files", - "ExperimentCollectionName": "Experiment" + "ExperimentCollectionName": "Experiment"*/ - /*"ConnectionString": "mongodb+srv://si_user:si_user@sidatabase.twtfm.mongodb.net/myFirstDatabase?retryWrites=true&w=majority", + "ConnectionString": "mongodb+srv://si_user:si_user@sidatabase.twtfm.mongodb.net/myFirstDatabase?retryWrites=true&w=majority", "DatabaseName": "si_db", "CollectionName": "users", "DatasetCollectionName": "Dataset", "ModelCollectionName": "Model", "PredictorCollectionName": "Predictor", "FilesCollectionName": "Files", - "ExperimentCollectionName": "Experiment" */ + "ExperimentCollectionName": "Experiment" } } \ No newline at end of file diff --git a/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.ts b/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.ts index c2bd3262..cba5252a 100644 --- a/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.ts +++ b/frontend/src/app/_elements/_charts/pie-chart/pie-chart.component.ts @@ -14,16 +14,16 @@ export class PieChartComponent implements AfterViewInit { @Input()uniqueValuesPercent?: number[] = []; updatePieChart(uniqueValues: string[], uniqueValuesPercent: number[]){ - console.log(this.uniqueValues, this.uniqueValuesPercent); - const newPieChartData = { - datasets: [{ - label: "Population (millions)", - backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850"], - data: [2478,5267,734,784,433], - }] - - } - }; + //console.log(this.uniqueValues, this.uniqueValuesPercent); + this.pieChartData.datasets = [{ + label: "%", + backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850", "#000000"], + data: uniqueValuesPercent, + }]; + this.pieChartData.labels = uniqueValues + console.log(this.uniqueValues, this.uniqueValuesPercent); + this.myChart?.update() + }; @ViewChild('piechart') chartRef!: ElementRef; constructor() { } @@ -33,13 +33,30 @@ export class PieChartComponent implements AfterViewInit { label: "Population (millions)", backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850"], data: [2478,5267,734,784,433] - }] + }], labels : [""] } + myChart?: Chart; ngAfterViewInit(): void { - const myChart = new Chart(this.chartRef.nativeElement, { + let rem = 100; + const percents : number[] = [] + this.uniqueValuesPercent?.forEach(percent => { + rem-=percent*100; + percents.push(percent*100) + + }) + const data = { + datasets: [{ + label: "%", + backgroundColor: ["#3e95cd", "#8e5ea2","#3cba9f","#e8c3b9","#c45850", "#000000"], + data: [...percents, rem] + }], labels : [...this.uniqueValues!,"Ostalo"] + } + + const myChart = new Chart(this.chartRef.nativeElement, { type: 'pie', - data: this.pieChartData, + data: data + , options: { /*title: { display: true, diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 9fdb6936..ad78feaf 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -83,8 +83,8 @@ export class ColumnTableComponent implements AfterViewInit { let i = 0; this.boxplotComp.changes.subscribe(() => { const bps = this.boxplotComp.toArray(); - this.dataset?.columnInfo.forEach(colInfo => { - if (this.experiment.columnTypes[i] == ColumnType.numerical) { + this.dataset?.columnInfo.forEach((colInfo, index) => { + if (this.experiment.columnTypes[index] == ColumnType.numerical) { bps[i].updateChart(colInfo!.min, colInfo.max, colInfo.q1, colInfo.q3, colInfo.median); i++; } @@ -96,8 +96,11 @@ export class ColumnTableComponent implements AfterViewInit { //min: number, max: number, q1: number, q3: number, median: number let i = 0; const pieChart = this.piechartComp.toArray(); - this.dataset?.columnInfo.forEach(colInfo => { - if (this.experiment.columnTypes[i] == ColumnType.categorical) { + console.log(pieChart) + this.dataset?.columnInfo.forEach((colInfo, index) => { + console.log(i) + if (this.experiment.columnTypes[index] == ColumnType.categorical) { + console.log("prosao IF") pieChart[i].updatePieChart(colInfo!.uniqueValues, colInfo.uniqueValuesPercent); i++; } -- cgit v1.2.3 From 84e02f0e7d895fe265be46e2f120076f92e3113f Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Thu, 19 May 2022 14:01:06 +0200 Subject: Ispravljen bag kod steppera (nije se ucitavao 3. korak kad se udje na exp iz kolekcije) i bag za updatePieChart pri ucitavanju eskperiment strane. --- frontend/src/app/_elements/column-table/column-table.component.ts | 4 +--- frontend/src/app/_pages/experiment/experiment.component.ts | 2 +- frontend/src/app/app-routing.module.ts | 3 ++- 3 files changed, 4 insertions(+), 5 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index ad78feaf..27bb608f 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -131,6 +131,7 @@ export class ColumnTableComponent implements AfterViewInit { } else { this.dataset = dataset; + this.experimentChanged.emit(); this.columnsChecked = []; this.dataset.columnInfo.forEach(column => { if (this.experiment.inputColumns.find(x => x == column.columnName) != undefined) @@ -157,9 +158,6 @@ export class ColumnTableComponent implements AfterViewInit { this.resetPagging(); this.loadData(); this.loaded = true; - - this.updateCharts(); - this.updatePieChart(); } loadData(){ diff --git a/frontend/src/app/_pages/experiment/experiment.component.ts b/frontend/src/app/_pages/experiment/experiment.component.ts index 22894131..6c8e96b3 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.ts +++ b/frontend/src/app/_pages/experiment/experiment.component.ts @@ -57,7 +57,7 @@ export class ExperimentComponent implements AfterViewInit, OnInit { this.dataset = response; this.folderDataset.forExperiment = this.experiment; this.folderDataset.selectFile(this.dataset); //sad 3. i 4. korak da se ucitaju - + //this.predictorsService.getPredictor(predictorId!).subscribe((response) => { let predictor = response; //this.modelsService.getModelById(predictor.modelId).subscribe((response) => { diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index 8c60a666..56442842 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -18,7 +18,8 @@ const routes: Routes = [ { path: 'archive', component: ArchiveComponent, data: { title: 'Arhiva' } }, { path: 'profile', component: ProfileComponent, canActivate: [AuthGuardService], data: { title: 'Profil' } }, { path: 'playground', component: PlaygroundComponent, data: { title: 'Zabava' } }, - { path: 'test', component: TestComponent, data: { title: 'Test' } } + { path: 'test', component: TestComponent, data: { title: 'Test' } }, + { path: '**', redirectTo: '' } ]; @NgModule({ -- cgit v1.2.3 From 529394dd526811e059dfb5f8f76597ffd90b2fea Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Thu, 19 May 2022 15:21:11 +0200 Subject: Sredjen bag preklapanja prozora na eksperiment strani. Sklonjen misteriozni skroler u missingValuesDialog-u. --- frontend/src/app/_elements/column-table/column-table.component.ts | 3 ++- .../_modals/missingvalues-dialog/missingvalues-dialog.component.css | 4 ++++ frontend/src/app/_pages/experiment/experiment.component.css | 6 ++++-- 3 files changed, 10 insertions(+), 3 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 27bb608f..f40167ad 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -334,7 +334,8 @@ export class ColumnTableComponent implements AfterViewInit { } openMissingValuesDialog() { const dialogRef = this.dialog.open(MissingvaluesDialogComponent, { - width: '500px' + width: '500px', + panelClass: 'custom-modalbox' }); dialogRef.afterClosed().subscribe(selectedMissingValuesOption => { if (selectedMissingValuesOption != undefined) diff --git a/frontend/src/app/_modals/missingvalues-dialog/missingvalues-dialog.component.css b/frontend/src/app/_modals/missingvalues-dialog/missingvalues-dialog.component.css index e99a1e1e..64d7bd21 100644 --- a/frontend/src/app/_modals/missingvalues-dialog/missingvalues-dialog.component.css +++ b/frontend/src/app/_modals/missingvalues-dialog/missingvalues-dialog.component.css @@ -5,4 +5,8 @@ #btnNo { color: gray; +} + +::ng-deep.mat-dialog-content { + overflow: visible; } \ No newline at end of file diff --git a/frontend/src/app/_pages/experiment/experiment.component.css b/frontend/src/app/_pages/experiment/experiment.component.css index 4f5b3d89..a8bc1248 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.css +++ b/frontend/src/app/_pages/experiment/experiment.component.css @@ -48,6 +48,7 @@ mat-stepper { flex-direction: row; justify-content: center; align-items: center; + margin-bottom: 100px; } .step-content-inside { @@ -70,6 +71,7 @@ mat-stepper { display: inline-block; text-align: left; } -.text-overflow-experiment-name{ + +.text-overflow-experiment-name { overflow-wrap: break-word; -} +} \ No newline at end of file -- cgit v1.2.3 From 4a8986ee2fa3f6d90108920ead97c8d5fce9d59c Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Thu, 19 May 2022 17:27:36 +0200 Subject: Ispravljen bag da kad je kolona izlazna ne moze da se izbrise/iskljuci zbog nedostajucih vrednosti. --- .../column-table/column-table.component.html | 2 +- .../column-table/column-table.component.ts | 37 ++++++++++++++++++---- .../app/_pages/experiment/experiment.component.css | 2 +- 3 files changed, 33 insertions(+), 8 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.html b/frontend/src/app/_elements/column-table/column-table.component.html index bb5914bd..e6a781be 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -217,7 +217,7 @@
Izlazna kolona - + {{inputColumn}} - diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index f40167ad..694b1a83 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -247,6 +247,19 @@ export class ColumnTableComponent implements AfterViewInit { } } + outputColumnChanged() { + let outputColReplacer = this.experiment.nullValuesReplacers.find(x => x.column == this.experiment.outputColumn); + let index = this.experiment.nullValuesReplacers.findIndex(x => x.column == this.experiment.outputColumn); + if (outputColReplacer != undefined) { + outputColReplacer.option = NullValueOptions.DeleteRows; + + let numOfRowsToDelete = (this.dataset!.columnInfo.filter(x => x.columnName == this.experiment.outputColumn)[0]).numNulls; + this.nullValOption[index] = "Obriši redove (" + numOfRowsToDelete + ")"; + } + + this.changeProblemType(); + } + changeProblemType() { if (this.experiment != undefined && this.dataset != undefined) { let i = this.dataset.columnInfo.findIndex(x => x.columnName == this.experiment!.outputColumn); @@ -298,14 +311,26 @@ export class ColumnTableComponent implements AfterViewInit { if (selectedMissingValuesOption == NullValueOptions.DeleteColumns) { this.experiment.nullValues = NullValueOptions.DeleteColumns; + + let outputColReplacer = this.experiment.nullValuesReplacers.find(x => x.column == this.experiment.outputColumn); + this.experiment.nullValuesReplacers = []; for (let i = 0; i < this.experiment.inputColumns.length; i++) { - this.experiment.nullValuesReplacers.push({ //ovo zakomentarisano - column: this.experiment.inputColumns[i], - option: NullValueOptions.DeleteColumns, - value: "" - }); - this.nullValOption[i] = "Obriši kolonu"; + if (this.experiment.inputColumns[i] != this.experiment.outputColumn) { + this.experiment.nullValuesReplacers.push({ //ovo zakomentarisano + column: this.experiment.inputColumns[i], + option: NullValueOptions.DeleteColumns, + value: "" + }); + this.nullValOption[i] = "Obriši kolonu"; + } + else { + if (outputColReplacer != undefined) { + this.experiment.nullValuesReplacers.push(outputColReplacer); + let numOfRowsToDelete = (this.dataset.columnInfo.filter(x => x.columnName == this.experiment!.inputColumns[i])[0]).numNulls; + this.nullValOption[i] = (outputColReplacer.option == NullValueOptions.DeleteRows) ? "Obriši redove (" + numOfRowsToDelete + ")" : "Popuni sa " + outputColReplacer.value + ""; + } + } } //obrisi kolone koje sadrze nedostajuce vrednosti iz input kolona /*for (let i = 0; i < this.dataset.columnInfo.length; i++) { diff --git a/frontend/src/app/_pages/experiment/experiment.component.css b/frontend/src/app/_pages/experiment/experiment.component.css index a8bc1248..59e004e9 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.css +++ b/frontend/src/app/_pages/experiment/experiment.component.css @@ -48,7 +48,7 @@ mat-stepper { flex-direction: row; justify-content: center; align-items: center; - margin-bottom: 100px; + /*margin-bottom: 100px;*/ } .step-content-inside { -- cgit v1.2.3 From 573019527eae41128b0716930dc0cfa0b019d317 Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Thu, 19 May 2022 21:50:51 +0200 Subject: Radi prikaz prediktora iz kolekcije na experiment strani (prva 4 koraka sve popunjeno, iscrtan grafik). Ispravljeno crtanje grafika toka obuke - radi. YesNoDialog stil. --- .../_charts/line-chart/line-chart.component.ts | 37 ++++----- .../column-table/column-table.component.ts | 2 +- .../src/app/_elements/folder/folder.component.ts | 2 +- .../yes-no-dialog/yes-no-dialog.component.css | 8 ++ .../yes-no-dialog/yes-no-dialog.component.html | 8 +- .../app/_pages/experiment/experiment.component.ts | 88 ++++++++++++---------- .../app/_pages/my-models/my-models.component.html | 43 ----------- .../app/_pages/my-models/my-models.component.ts | 59 --------------- frontend/src/app/app-routing.module.ts | 2 +- 9 files changed, 81 insertions(+), 168 deletions(-) delete mode 100644 frontend/src/app/_pages/my-models/my-models.component.html delete mode 100644 frontend/src/app/_pages/my-models/my-models.component.ts (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') 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 89a76a44..7d21129c 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 @@ -41,32 +41,33 @@ export class LineChartComponent implements AfterViewInit { } } update(myEpochs: number[], myAcc: number[], myLoss: number[], myMae: number[], myMse: number[], myValAcc:number[],myValLoss:number[],myValMae:number[],myValMse: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.dataAcc.length = 0; + this.dataAcc.push(...myAcc); this.dataLOSS.length = 0; this.dataLOSS.push(...myLoss); - this.dataMSE.length = 0; - this.dataMSE.push(...myValAcc); + this.dataMAE.length = 0; + this.dataMAE.push(...myMae); this.dataMSE.length = 0; - this.dataMSE.push(...myValLoss); + this.dataMSE.push(...myMse); - this.dataMSE.length = 0; - this.dataMSE.push(...myValMae); + this.dataValAcc.length = 0; + this.dataValAcc.push(...myValAcc); - this.dataMSE.length = 0; - this.dataMSE.push(...myValMse); + this.dataValLoss.length = 0; + this.dataValLoss.push(...myValLoss); - this.dataMSE.length = 0; - this.dataMSE.push(...myMse); + this.dataValMAE.length = 0; + this.dataValMAE.push(...myValMae); + + this.dataValMSE.length = 0; + this.dataValMSE.push(...myValMse); this.myChart.update(); } @@ -89,7 +90,7 @@ export class LineChartComponent implements AfterViewInit { }, { label: 'Val_Accuracy', - data: this.dataMSE, + data: this.dataValAcc, borderWidth: 1 }, { @@ -99,7 +100,7 @@ export class LineChartComponent implements AfterViewInit { }, { label: 'Val_Loss', - data: this.dataMSE, + data: this.dataValLoss, borderWidth: 1 }, { @@ -109,7 +110,7 @@ export class LineChartComponent implements AfterViewInit { }, { label: 'Val_MAE', - data: this.dataMSE, + data: this.dataValMAE, borderWidth: 1 }, { @@ -119,7 +120,7 @@ export class LineChartComponent implements AfterViewInit { }, { label: 'Val_MSE', - data: this.dataMSE, + data: this.dataValMSE, borderWidth: 1 } ] diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 694b1a83..e12065a3 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -110,7 +110,7 @@ export class ColumnTableComponent implements AfterViewInit { loadDataset(dataset: Dataset) { console.log("LOADED DATASET"); - if (this.route.snapshot.paramMap.get("id") == null) { + if (this.route.snapshot.paramMap.get("id") == null && this.route.snapshot.paramMap.get("predictorId") == null) { this.dataset = dataset; this.setColumnTypeInitial(); diff --git a/frontend/src/app/_elements/folder/folder.component.ts b/frontend/src/app/_elements/folder/folder.component.ts index 254298fb..d2175f73 100644 --- a/frontend/src/app/_elements/folder/folder.component.ts +++ b/frontend/src/app/_elements/folder/folder.component.ts @@ -120,7 +120,7 @@ export class FolderComponent implements AfterViewInit { } goToExperimentPageWithPredictor(file: FolderFile, predictor: Predictor) { - this.router.navigate(['/experiment/' + file._id + "/" + predictor._id]); + this.router.navigate(['/experiment/p/' + predictor._id]); } createNewFile() { diff --git a/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.css b/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.css index e69de29b..e99a1e1e 100644 --- a/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.css +++ b/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.css @@ -0,0 +1,8 @@ +#btnYes { + background-color: var(--offwhite); + color: var(--ns-bg-dark-100); +} + +#btnNo { + color: gray; +} \ No newline at end of file diff --git a/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.html b/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.html index 77e7be42..259aec0d 100644 --- a/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.html +++ b/frontend/src/app/_modals/yes-no-dialog/yes-no-dialog.component.html @@ -1,10 +1,10 @@ -

{{data.title}}

-
+

{{data.title}}

+
{{data.message}}
- - + +
\ No newline at end of file diff --git a/frontend/src/app/_pages/experiment/experiment.component.ts b/frontend/src/app/_pages/experiment/experiment.component.ts index 6c8e96b3..7cb5e7cd 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.ts +++ b/frontend/src/app/_pages/experiment/experiment.component.ts @@ -21,7 +21,7 @@ import { PredictorsService } from 'src/app/_services/predictors.service'; templateUrl: './experiment.component.html', styleUrls: ['./experiment.component.css'] }) -export class ExperimentComponent implements AfterViewInit, OnInit { +export class ExperimentComponent implements AfterViewInit { @ViewChild(MatStepper) stepper!: MatStepper; @ViewChild('stepsContainer') stepsContainer!: ElementRef; @@ -44,46 +44,6 @@ export class ExperimentComponent implements AfterViewInit, OnInit { this.experiment = new Experiment("exp1"); } - ngOnInit(): void { - this.route.queryParams.subscribe(params => { - - let experimentId = this.route.snapshot.paramMap.get("id"); - let predictorId = this.route.snapshot.paramMap.get("predictorId"); - - if (predictorId != null && experimentId != null) { - this.experimentsService.getExperimentById(experimentId).subscribe((response) => { - this.experiment = response; - this.datasetsService.getDatasetById(this.experiment.datasetId).subscribe((response: Dataset) => { - this.dataset = response; - this.folderDataset.forExperiment = this.experiment; - this.folderDataset.selectFile(this.dataset); //sad 3. i 4. korak da se ucitaju - - //this.predictorsService.getPredictor(predictorId!).subscribe((response) => { - let predictor = response; - //this.modelsService.getModelById(predictor.modelId).subscribe((response) => { - this.modelsService.getModelById("62853d70696d62ceeb8db7cd").subscribe((response) => { - //imamo model - this.folderModel.formModel.newModel = response; - //this.metricView.update(predictor.metrics); - }); - //}); - }); - }); - } - else if (predictorId == null && experimentId != null) { - this.experimentsService.getExperimentById(experimentId).subscribe((response) => { - this.experiment = response; - this.datasetsService.getDatasetById(this.experiment.datasetId).subscribe((response: Dataset) => { - this.dataset = response; - this.folderDataset.forExperiment = this.experiment; - this.folderDataset.selectFile(this.dataset); - }); - }); - } - - }); - } - /*updateExperiment(){ }*/ @@ -136,6 +96,52 @@ export class ExperimentComponent implements AfterViewInit, OnInit { }); } + + this.route.queryParams.subscribe(params => { + + let experimentId = this.route.snapshot.paramMap.get("id"); + let predictorId = this.route.snapshot.paramMap.get("predictorId"); + console.log("paramexp: ", experimentId, ", parampredictor: ", predictorId); + if (predictorId != null) { + this.predictorsService.getPredictor(predictorId!).subscribe((response) => { + let predictor = response; + //console.log("predictor: ", predictor); + this.experimentsService.getExperimentById(predictor.experimentId).subscribe((response) => { + this.experiment = response; + //console.log("experiment: ", this.experiment); + this.datasetsService.getDatasetById(this.experiment.datasetId).subscribe((response: Dataset) => { + this.dataset = response; + //console.log("dataset: ", this.dataset); + this.folderDataset.forExperiment = this.experiment; + this.folderDataset.selectFile(this.dataset); //sad 3. i 4. korak da se ucitaju + + this.modelsService.getModelById(predictor.modelId).subscribe((response) => { + let model = response; + //console.log("model: ", model); + this.folderModel.formModel.newModel = model; + this.step3 = true; + let numOfEpochsArray = Array.from({length: model.epochs}, (_, i) => i + 1); + //console.log("metric view1:", this.metricView); + setTimeout(() => { + this.metricView.linechartComponent.update(numOfEpochsArray, predictor.metricsAcc, predictor.metricsLoss, predictor.metricsMae, predictor.metricsMse, predictor.metricsValAcc, predictor.metricsValLoss, predictor.metricsValMae, predictor.metricsValMse); + }) + }); + }); + }); + }); + } + else if (experimentId != null) { + this.experimentsService.getExperimentById(experimentId).subscribe((response) => { + this.experiment = response; + this.datasetsService.getDatasetById(this.experiment.datasetId).subscribe((response: Dataset) => { + this.dataset = response; + this.folderDataset.forExperiment = this.experiment; + this.folderDataset.selectFile(this.dataset); + }); + }); + } + + }); } history: any[] = []; diff --git a/frontend/src/app/_pages/my-models/my-models.component.html b/frontend/src/app/_pages/my-models/my-models.component.html deleted file mode 100644 index 9b281239..00000000 --- a/frontend/src/app/_pages/my-models/my-models.component.html +++ /dev/null @@ -1,43 +0,0 @@ - -
-
-
- -
-
- -
-
- - - - - - -
-
-
-

Nema rezultata

-
-
- -
- - - - - -
diff --git a/frontend/src/app/_pages/my-models/my-models.component.ts b/frontend/src/app/_pages/my-models/my-models.component.ts deleted file mode 100644 index d379fa69..00000000 --- a/frontend/src/app/_pages/my-models/my-models.component.ts +++ /dev/null @@ -1,59 +0,0 @@ -import { Component, OnInit } from '@angular/core'; -import { Router } from '@angular/router'; -import shared from 'src/app/Shared'; -import Model from 'src/app/_data/Model'; -import { ModelsService } from 'src/app/_services/models.service'; - -@Component({ - selector: 'app-my-models', - templateUrl: './my-models.component.html', - styleUrls: ['./my-models.component.css'] -}) -export class MyModelsComponent implements OnInit { - myModels: Model[] = []; - //myModel: Model; - - constructor(private modelsS : ModelsService, private router : Router) { - - - - } - - ngOnInit(): void { - this.getAllMyModels(); - - } -/* - editModel(): void{ - this.modelsS.editModel().subscribe(m => { - this.myModel = m; - - }) - } -*/ - -deleteThisModel(model: Model): void{ - shared.openYesNoDialog('Brisanje seta podataka','Da li ste sigurni da želite da obrišete model?',() => { - this.modelsS.deleteModel(model).subscribe((response) => { - this.getAllMyModels(); - }, (error) =>{ - if (error.error == "Model with name = {name} deleted") { - shared.openDialog("Obaveštenje", "Greška prilikom brisanja modela."); - } - }); - }); -} - - -useThisModel(model: Model): void{ - - this.router.navigate(['/training']) - -} - getAllMyModels(): void{ - this.modelsS.getMyModels().subscribe(m => { - this.myModels = m; - }); - } - -} diff --git a/frontend/src/app/app-routing.module.ts b/frontend/src/app/app-routing.module.ts index 56442842..d5552ce9 100644 --- a/frontend/src/app/app-routing.module.ts +++ b/frontend/src/app/app-routing.module.ts @@ -12,7 +12,7 @@ import { TestComponent } from './_pages/test/test.component'; const routes: Routes = [ { path: '', component: HomeComponent, data: { title: 'Početna strana' } }, - { path: 'experiment/:id/:predictorId', component: ExperimentComponent, data: { title: 'Eksperiment' } }, + { path: 'experiment/p/:predictorId', component: ExperimentComponent, data: { title: 'Eksperiment' } }, { path: 'experiment/:id', component: ExperimentComponent, data: { title: 'Eksperiment' } }, { path: 'experiment', component: ExperimentComponent, data: { title: 'Eksperiment' } }, { path: 'archive', component: ArchiveComponent, data: { title: 'Arhiva' } }, -- cgit v1.2.3 From f51b5e2de9e29a0a3ab998f335c110131cb40ce7 Mon Sep 17 00:00:00 2001 From: Ognjen Cirkovic Date: Thu, 19 May 2022 22:15:28 +0200 Subject: Popravljen box-plot. --- .../_charts/box-plot/box-plot.component.ts | 70 ++++++++++------------ .../column-table/column-table.component.ts | 29 +-------- 2 files changed, 32 insertions(+), 67 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/_charts/box-plot/box-plot.component.ts b/frontend/src/app/_elements/_charts/box-plot/box-plot.component.ts index 07976da3..b3d25280 100644 --- a/frontend/src/app/_elements/_charts/box-plot/box-plot.component.ts +++ b/frontend/src/app/_elements/_charts/box-plot/box-plot.component.ts @@ -16,25 +16,16 @@ Chart.register(BoxPlotController, BoxAndWiskers, LinearScale, CategoryScale); }) export class BoxPlotComponent implements AfterViewInit { - @Input() width?: number; - @Input() height?: number; - @Input() mean?: number; - @Input() median?: number; - @Input() min?: number; - @Input() max?: number; - @Input() q1?: number; - @Input() q3?: number; + @Input() width!: number; + @Input() height!: number; + @Input() mean!: number; + @Input() median!: number; + @Input() min!: number; + @Input() max!: number; + @Input() q1!: number; + @Input() q3!: number; - updateChart(min: number, max: number, q1: number, q3: number, median: number) { - if (this.myChart) { - this.boxplotData.datasets[0].data = [[min, q1, median, q3, max]] - this.myChart?.update(); - } - /*this.boxplotData.datasets = [{ - data: [[min, q1, median, q3, max]], - }]*/ - - }; + /* updatePieChart(uniqueValues: string[], uniqueValuesPercent: number[]){ @@ -55,27 +46,29 @@ export class BoxPlotComponent implements AfterViewInit { //this.updateChart(); } - boxplotData = { - // define label tree - //labels: ['January'/*, 'February', 'March', 'April', 'May', 'June', 'July'*/], - datasets: [{ - label: 'Dataset 1', - backgroundColor: '#0063AB', - borderColor: '#dfd7d7', - borderWidth: 1, - outlierColor: '#999999', - scaleFontColor: '#0063AB', - padding: 10, - itemRadius: 0, - data: [ - randomValues(100, 0, 100), - ] - }] - }; + ngAfterViewInit(): void { - this.myChart = new Chart(this.chartRef.nativeElement, { + const boxplotData = { + // define label tree + //labels: ['January'/*, 'February', 'March', 'April', 'May', 'June', 'July'*/], + labels:[""], + datasets: [{ + label: 'Dataset 1', + backgroundColor: '#0063AB', + borderColor: '#dfd7d7', + borderWidth: 1, + outlierColor: '#999999', + scaleFontColor: '#0063AB', + padding: 10, + itemRadius: 0, + data: [ + {min:this.min,q1:this.q1,q3:this.q3,median:this.median,max:this.max,mean:this.mean} + ] + }] + }; + const myChart = new Chart(this.chartRef.nativeElement, { type: "boxplot", - data: this.boxplotData, + data: boxplotData, options: { plugins: { legend: { @@ -92,8 +85,6 @@ export class BoxPlotComponent implements AfterViewInit { } }, y: { - min: this.min, - max: this.max, ticks: { color: '#dfd7d7' }, @@ -106,5 +97,4 @@ export class BoxPlotComponent implements AfterViewInit { }); } - myChart?: Chart; } diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 694b1a83..fa418e23 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -78,34 +78,9 @@ export class ColumnTableComponent implements AfterViewInit { } - updateCharts() { - //min: number, max: number, q1: number, q3: number, median: number - let i = 0; - this.boxplotComp.changes.subscribe(() => { - const bps = this.boxplotComp.toArray(); - this.dataset?.columnInfo.forEach((colInfo, index) => { - if (this.experiment.columnTypes[index] == ColumnType.numerical) { - bps[i].updateChart(colInfo!.min, colInfo.max, colInfo.q1, colInfo.q3, colInfo.median); - i++; - } - }); - }); - } + + - updatePieChart() { - //min: number, max: number, q1: number, q3: number, median: number - let i = 0; - const pieChart = this.piechartComp.toArray(); - console.log(pieChart) - this.dataset?.columnInfo.forEach((colInfo, index) => { - console.log(i) - if (this.experiment.columnTypes[index] == ColumnType.categorical) { - console.log("prosao IF") - pieChart[i].updatePieChart(colInfo!.uniqueValues, colInfo.uniqueValuesPercent); - i++; - } - }); - } loadDataset(dataset: Dataset) { console.log("LOADED DATASET"); -- cgit v1.2.3 From a2d7403e056779133d258c198bedf278080f80f4 Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Fri, 20 May 2022 02:35:32 +0200 Subject: Postavljeno da nullValReplacers prati dataset.columnInfo (po indeksima) i iskljucivanje kolona sa nedostajucim vrednostima ako korisnik to odabere. --- .../column-table/column-table.component.ts | 78 ++++++++++++++-------- 1 file changed, 51 insertions(+), 27 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 9a8cbeee..26228978 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -114,20 +114,11 @@ export class ColumnTableComponent implements AfterViewInit { else this.columnsChecked.push(false); }); - this.nullValOption = []; + //this.nullValOption = []; for (let i = 0; i < this.dataset!.columnInfo.length; i++) { - let nullValRep = this.experiment.nullValuesReplacers.find(x => x.column == this.dataset!.columnInfo[i].columnName); - if (nullValRep != undefined) { - if (nullValRep.option == NullValueOptions.DeleteRows) - this.nullValOption.push(`Obriši redove (${this.dataset.columnInfo[i].numNulls})`); - else if (nullValRep.option == NullValueOptions.DeleteColumns) - this.nullValOption.push(`Obriši kolonu`); - else { - this.nullValOption.push(`Popuni sa ${nullValRep.value}`); - } - } - else - this.nullValOption.push(`Obriši redove (${this.dataset.columnInfo[i].numNulls})`); + //let nullValRep = this.experiment.nullValuesReplacers.find(x => x.column == this.dataset!.columnInfo[i].columnName); + let nullValRep = this.experiment.nullValuesReplacers[i]; + this.nullValOption[i] = (nullValRep.option == NullValueOptions.DeleteRows) ? `Obriši redove (${this.dataset.columnInfo[i].numNulls})` : ((nullValRep.option == NullValueOptions.DeleteColumns) ? `Isključi kolonu` : `Popuni sa ${nullValRep.value}`); } } this.resetPagging(); @@ -171,10 +162,10 @@ export class ColumnTableComponent implements AfterViewInit { } setDeleteRowsForMissingValTreatment() { - if (this.experiment != undefined) { + if (this.experiment != undefined && this.dataset != undefined) { this.experiment.nullValues = NullValueOptions.DeleteRows; this.experiment.nullValuesReplacers = []; - for (let i = 0; i < this.experiment.inputColumns.length; i++) { + for (let i = 0; i < this.dataset?.columnInfo.length; i++) { this.experiment.nullValuesReplacers.push({ column: this.experiment.inputColumns[i], option: NullValueOptions.DeleteRows, @@ -204,13 +195,17 @@ export class ColumnTableComponent implements AfterViewInit { } if (this.experiment.inputColumns.length == 1) this.experiment.outputColumn = this.experiment.inputColumns[0]; + + let index = this.dataset?.columnInfo.findIndex(x => x.columnName == columnName)!; + this.nullValOption[index] = (this.experiment.nullValuesReplacers[index].option == NullValueOptions.DeleteRows) ? "Obriši redove (" + this.dataset?.columnInfo[index].numNulls + ")" : "Popuni sa " + this.experiment.nullValuesReplacers[index].value; } else { this.experiment.inputColumns = this.experiment.inputColumns.filter(x => x != columnName); //console.log("Input columns: ", this.experiment.inputColumns); //TODO: da se zatamni kolona koja je unchecked //this.experiment.encodings = this.experiment.encodings.filter(x => x.columnName != columnName); samo na kraju iz enkodinga skloni necekirane - this.experiment.nullValuesReplacers = this.experiment.nullValuesReplacers.filter(x => x.column != columnName); + let index = this.dataset?.columnInfo.findIndex(x => x.columnName == columnName)!; + this.nullValOption[index] = "Isključi kolonu"; if (columnName == this.experiment.outputColumn) { if (this.experiment.inputColumns.length > 0) this.experiment.outputColumn = this.experiment.inputColumns[0]; @@ -224,11 +219,12 @@ export class ColumnTableComponent implements AfterViewInit { outputColumnChanged() { let outputColReplacer = this.experiment.nullValuesReplacers.find(x => x.column == this.experiment.outputColumn); - let index = this.experiment.nullValuesReplacers.findIndex(x => x.column == this.experiment.outputColumn); + //let index = this.experiment.nullValuesReplacers.findIndex(x => x.column == this.experiment.outputColumn); if (outputColReplacer != undefined) { outputColReplacer.option = NullValueOptions.DeleteRows; let numOfRowsToDelete = (this.dataset!.columnInfo.filter(x => x.columnName == this.experiment.outputColumn)[0]).numNulls; + let index = this.dataset!.columnInfo.findIndex(x => x.columnName == this.experiment.outputColumn); this.nullValOption[index] = "Obriši redove (" + numOfRowsToDelete + ")"; } @@ -285,7 +281,16 @@ export class ColumnTableComponent implements AfterViewInit { if (this.experiment != undefined && this.dataset != undefined) { if (selectedMissingValuesOption == NullValueOptions.DeleteColumns) { - this.experiment.nullValues = NullValueOptions.DeleteColumns; + for (let i = 0; i < this.dataset.columnInfo.length; i++) { + if (this.dataset.columnInfo[i].numNulls > 0 && this.dataset.columnInfo[i].columnName != this.experiment.outputColumn) { + this.experiment.inputColumns = this.experiment.inputColumns.filter(x => x != this.dataset!.columnInfo[i].columnName); + this.columnsChecked[i] = false; + console.log(this.dataset!.columnInfo[i].columnName); + + this.nullValOption[i] = "Isključi kolonu"; + } + } + /*this.experiment.nullValues = NullValueOptions.DeleteColumns; let outputColReplacer = this.experiment.nullValuesReplacers.find(x => x.column == this.experiment.outputColumn); @@ -297,16 +302,18 @@ export class ColumnTableComponent implements AfterViewInit { option: NullValueOptions.DeleteColumns, value: "" }); - this.nullValOption[i] = "Obriši kolonu"; + let colIndex = this.dataset.columnInfo.findIndex(x => x.columnName == this.experiment.inputColumns[i]); + this.nullValOption[colIndex] = "Isključi kolonu"; } else { if (outputColReplacer != undefined) { this.experiment.nullValuesReplacers.push(outputColReplacer); let numOfRowsToDelete = (this.dataset.columnInfo.filter(x => x.columnName == this.experiment!.inputColumns[i])[0]).numNulls; - this.nullValOption[i] = (outputColReplacer.option == NullValueOptions.DeleteRows) ? "Obriši redove (" + numOfRowsToDelete + ")" : "Popuni sa " + outputColReplacer.value + ""; + let colIndex = this.dataset.columnInfo.findIndex(x => x.columnName == this.experiment.inputColumns[i]); + this.nullValOption[colIndex] = (outputColReplacer.option == NullValueOptions.DeleteRows) ? "Obriši redove (" + numOfRowsToDelete + ")" : "Popuni sa " + outputColReplacer.value + ""; } } - } + }*/ //obrisi kolone koje sadrze nedostajuce vrednosti iz input kolona /*for (let i = 0; i < this.dataset.columnInfo.length; i++) { if (this.dataset.columnInfo[i].numNulls > 0) { @@ -326,7 +333,8 @@ export class ColumnTableComponent implements AfterViewInit { value: "" }); let numOfRowsToDelete = (this.dataset.columnInfo.filter(x => x.columnName == this.experiment!.inputColumns[i])[0]).numNulls; - this.nullValOption[i] = "Obriši redove (" + numOfRowsToDelete + ")"; + let colIndex = this.dataset.columnInfo.findIndex(x => x.columnName == this.experiment.inputColumns[i]); + this.nullValOption[colIndex] = "Obriši redove (" + numOfRowsToDelete + ")"; } } this.columnTableChangeDetected(); @@ -369,7 +377,16 @@ export class ColumnTableComponent implements AfterViewInit { MissValsDeleteClicked(event: Event, replacementType: NullValueOptions, index: number) { if (this.experiment != undefined && this.dataset != undefined) { - let columnName = (event.currentTarget).value; + + this.experiment.nullValuesReplacers[index].option = NullValueOptions.DeleteRows; + this.experiment.nullValuesReplacers[index].value = ""; + + this.nullValOption[index] = "Obriši redove (" + this.dataset.columnInfo[index].numNulls + ")"; + + this.columnTableChangeDetected(); + } + + /*let columnName = (event.currentTarget).value; let arrayElement = this.experiment.nullValuesReplacers.filter(x => x.column == columnName)[0]; if (arrayElement == undefined) { @@ -385,14 +402,21 @@ export class ColumnTableComponent implements AfterViewInit { } let numOfRowsToDelete = (this.dataset.columnInfo.filter(x => x.columnName == this.experiment!.inputColumns[index])[0]).numNulls; - this.nullValOption[index] = (replacementType == NullValueOptions.DeleteColumns) ? "Obriši kolonu" : "Obriši redove (" + numOfRowsToDelete + ")"; + this.nullValOption[index] = (replacementType == NullValueOptions.DeleteColumns) ? "Isključi kolonu" : "Obriši redove (" + numOfRowsToDelete + ")"; this.columnTableChangeDetected(); - } + }*/ } MissValsReplaceClicked(event: Event, columnName: string, index: number) { if (this.experiment != undefined) { - let fillValue = (event.currentTarget).value; + this.experiment.nullValuesReplacers[index].option = NullValueOptions.Replace; + let value = (event.currentTarget).value; + this.experiment.nullValuesReplacers[index].value = value; + this.nullValOption[index] = "Popuni sa " + value; + + this.columnTableChangeDetected(); + + /*let fillValue = (event.currentTarget).value; let arrayElement = this.experiment.nullValuesReplacers.filter(x => x.column == columnName)[0]; if (arrayElement == undefined) { @@ -408,7 +432,7 @@ export class ColumnTableComponent implements AfterViewInit { } this.nullValOption[index] = "Popuni sa: " + fillValue; - this.columnTableChangeDetected(); + this.columnTableChangeDetected();*/ } } getValue(columnName: string): string { -- cgit v1.2.3 From 032700eff2c33537ff25f4e306051a2c620a415a Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Fri, 20 May 2022 03:48:46 +0200 Subject: Kad izabere izlaznu kolonu automatski se setuje tip problema - fix --- .../app/_elements/column-table/column-table.component.ts | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) (limited to 'frontend/src/app/_elements/column-table/column-table.component.ts') diff --git a/frontend/src/app/_elements/column-table/column-table.component.ts b/frontend/src/app/_elements/column-table/column-table.component.ts index 26228978..a9057695 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -155,8 +155,10 @@ export class ColumnTableComponent implements AfterViewInit { } } resetOutputColumn() { - if (this.experiment.inputColumns.length > 0) + if (this.experiment.inputColumns.length > 0) { this.experiment.outputColumn = this.experiment.inputColumns[0]; + this.changeProblemType(); + } else this.experiment.outputColumn = '-'; } @@ -233,15 +235,21 @@ export class ColumnTableComponent implements AfterViewInit { changeProblemType() { if (this.experiment != undefined && this.dataset != undefined) { + //console.log(this.experiment.outputColumn); let i = this.dataset.columnInfo.findIndex(x => x.columnName == this.experiment!.outputColumn); if (i == -1 || this.experiment.columnTypes[i] == ColumnType.numerical) { + //console.log("USAO U REGRESIONI"); this.experiment.type = ProblemType.Regression; } else { - if (this.dataset.columnInfo[i].uniqueValues!.length == 2) + if (this.dataset.columnInfo[i].uniqueValues!.length == 2) { + //console.log("USAO U BINARY"); this.experiment.type = ProblemType.BinaryClassification; - else + } + else { + //console.log("USAO U multi"); this.experiment.type = ProblemType.MultiClassification; + } } this.columnTableChangeDetected(); } -- cgit v1.2.3