diff options
Diffstat (limited to 'frontend/src/app/_elements')
6 files changed, 58 insertions, 20 deletions
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 bf5e3fd6..07976da3 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 @@ -28,10 +28,28 @@ export class BoxPlotComponent implements AfterViewInit { 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.myChart?.update(); } + /*this.boxplotData.datasets = [{ + data: [[min, q1, median, q3, max]], + }]*/ + }; + /* + updatePieChart(uniqueValues: string[], uniqueValuesPercent: number[]){ + //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('boxplot') chartRef!: ElementRef; constructor() { //this.updateChart(); 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 cba5252a..9264e41c 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 @@ -58,10 +58,6 @@ export class PieChartComponent implements AfterViewInit { data: data , options: { - /*title: { - display: true, - text: 'Predicted world population (millions) in 2050' - }*/ plugins:{ legend: { display: false diff --git a/frontend/src/app/_elements/column-table/column-table.component.css b/frontend/src/app/_elements/column-table/column-table.component.css index f7f07e62..311773f7 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.css +++ b/frontend/src/app/_elements/column-table/column-table.component.css @@ -22,7 +22,7 @@ table.fixed td { table.fixed th { overflow: hidden; - max-width: 120px; + max-width: 250px; min-width: 120px; vertical-align: middle; background-color: var(--ns-primary-50); 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 31c32dfd..e6a781be 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -35,7 +35,7 @@ </thead> <tbody> <tr *ngFor="let row of tableData; let i = index"> - <th>#{{i}}</th> + <th>#{{((this.begin/10)+1)*10-10+i+1}}</th> <td *ngFor="let col of row; let j = index" [ngClass]="{'text-disabled' : !columnsChecked[j]}"> <div class="text-overflow"> {{col}} @@ -200,7 +200,7 @@ </mat-menu> </div> <div *ngIf="colInfo.numNulls == 0" class="text-left"> - Nema null vrednosti. + Nema nedostajućih vrednosti. </div> </td> </tr> @@ -217,7 +217,7 @@ <div class="ns-col rounded"> <mat-form-field appearance="fill" class="align-items-center justify-content-center pt-3 w-100"> <mat-label>Izlazna kolona</mat-label> - <mat-select [(value)]="experiment.outputColumn" (selectionChange)="changeProblemType()"> + <mat-select [(value)]="experiment.outputColumn" (selectionChange)="outputColumnChanged()"> <mat-option *ngFor="let inputColumn of experiment.inputColumns" [value]="inputColumn">{{inputColumn}}</mat-option> <mat-option *ngIf="experiment.inputColumns.length == 0" value="-">-</mat-option> </mat-select> 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..694b1a83 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(){ @@ -249,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); @@ -300,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++) { @@ -336,7 +359,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/_elements/folder/folder.component.css b/frontend/src/app/_elements/folder/folder.component.css index 2b7892a3..97c13299 100644 --- a/frontend/src/app/_elements/folder/folder.component.css +++ b/frontend/src/app/_elements/folder/folder.component.css @@ -184,7 +184,7 @@ .file-bottom-buttons { position: absolute; - bottom: 15px; + bottom: 5px; right: 4%; display: flex; flex-direction: row-reverse; |