1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
|
<table *ngIf="dataset && experiment" class="table text-offwhite fixed bg-blur">
<thead>
<tr>
<th>Naziv</th>
<th class="columnNames" *ngFor="let colInfo of dataset.columnInfo; let i = index">
<div class="cell-align">
#{{i + 1}} {{colInfo.columnName}}
<mat-checkbox checked (change)="changeInputColumns($event, colInfo.columnName)"></mat-checkbox>
</div>
</th>
</tr>
</thead>
<tbody>
<tr>
<th>Tip</th>
<td *ngFor="let colInfo of dataset.columnInfo; let i = index">
<mat-form-field>
<mat-select matNativeControl [(value)]="colInfo.isNumber">
<mat-option [value]="false">Kategorijski</mat-option>
<mat-option [value]="true">Numerički</mat-option>
</mat-select>
</mat-form-field>
</td>
</tr>
<tr class="graphics-row">
<th class="no-pad border-bottom">Grafik</th>
<td class="graphic-class no-pad" *ngFor="let colInfo of dataset.columnInfo; let i = index">
<app-box-plot *ngIf="colInfo.isNumber" [width]="150" [height]="150"></app-box-plot>
<app-pie-chart *ngIf="!colInfo.isNumber" [width]="150" [height]="150"></app-pie-chart>
</td>
</tr>
<tr>
<th class="brighter">Statistika</th>
<td *ngFor="let colInfo of dataset.columnInfo; let i = index">
<span *ngIf="colInfo.isNumber">
Mean: {{colInfo.mean}}<br>
Median: {{colInfo.median}}<br>
Min: {{colInfo.min}}<br>
Max: {{colInfo.max}}<br>
<!-- TODO na ML-u: Q1 i Q3 u statistici
Q1: {{colInfo.q1}}<br>
Q3: {{colInfo.q3}}<br>
-->
</span>
<div class="text-overflow" *ngIf="!colInfo.isNumber">
<span *ngFor="let uniqueValue of colInfo.uniqueValues | slice:0:6; let i = index">
{{uniqueValue}}<br><!-- TODO na ML-u: broj ponavljanja unique values-a u zagradi nek pise -->
</span>
</div>
</td>
</tr>
<tr style="padding: 0">
<th class="brighter cell-align" (click)="openEncodingDialog()">
<span class="verticalAlign">Enkodiranje</span>
<span class="material-icons-round verticalAlign">settings</span>
</th>
<td *ngFor="let colInfo of dataset.columnInfo; let i = index">
<mat-form-field>
<mat-select matNativeControl [(value)]="experiment.encodings[i].encoding">
<mat-option *ngFor="let option of Object.keys(Encoding); let optionName of Object.values(Encoding)" [value]="option">
{{ optionName }}
</mat-option>
</mat-select>
</mat-form-field>
</td>
</tr>
<tr>
<th class="brighter cell-align" (click)="openMissingValuesDialog()">
<div id="missingValuesHeader">Regulisanje<br>nedostajućih<br>vrednosti<br></div>
<span class="material-icons-round">settings</span>
</th>
<td *ngFor="let colInfo of dataset.columnInfo; let i = index">
<button class="w-100" mat-raised-button [matMenuTriggerFor]="menu" id="main_{{colInfo.columnName}}" #nullValMenu>
<div class="cell-align">
{{nullValOption[i]}}
<mat-icon>arrow_drop_down</mat-icon>
</div>
</button>
<mat-menu #menu="matMenu">
<button mat-menu-item (click)="MissValsDeleteClicked($event, NullValueOptions.DeleteColumns, i)" value={{colInfo.columnName}}>Obriši kolonu</button>
<button mat-menu-item (click)="MissValsDeleteClicked($event, NullValueOptions.DeleteRows, i)" value={{colInfo.columnName}}>Obriši redove</button>
<button mat-menu-item [matMenuTriggerFor]="fillWith">Popuni sa ____</button>
</mat-menu>
<mat-menu #fillWith="matMenu">
<button *ngIf="colInfo.isNumber" mat-menu-item (click)="MissValsReplaceClicked($event, colInfo.columnName, i)" value={{colInfo.mean}}>Mean ({{colInfo.mean}})</button>
<button *ngIf="colInfo.isNumber" mat-menu-item (click)="MissValsReplaceClicked($event, colInfo.columnName, i)" value={{colInfo.median}}>Median ({{colInfo.median}})</button>
<button *ngIf="colInfo.isNumber" mat-menu-item (click)="MissValsReplaceClicked($event, colInfo.columnName, i)" value={{colInfo.max}}>Max ({{colInfo.max}})</button>
<button *ngIf="colInfo.isNumber" mat-menu-item (click)="MissValsReplaceClicked($event, colInfo.columnName, i)" value={{colInfo.min}}>Min ({{colInfo.min}})</button>
<button *ngIf="!colInfo.isNumber" mat-menu-item [matMenuTriggerFor]="uniques">Najčešće vrednosti</button>
<button mat-menu-item [matMenuTriggerFor]="replaceWith">Unesi vrednost...</button>
</mat-menu>
<mat-menu #uniques="matMenu">
<button mat-menu-item *ngFor="let uniqueValue of colInfo.uniqueValues" (click)="MissValsReplaceClicked($event, colInfo.columnName, i)" value={{uniqueValue}}>{{uniqueValue}}</button>
</mat-menu>
<mat-menu #replaceWith="matMenu">
<input type="text" id={{colInfo.columnName}} mat-menu-item placeholder="Unesi vrednost..." [value]>
<button [disabled]="getValue(colInfo.columnName) == ''" mat-menu-item value={{getValue(colInfo.columnName)}} (click)="MissValsReplaceClicked($event, colInfo.columnName, i)">Potvrdi unos</button>
</mat-menu>
</td>
</tr>
<tr class="row-height" *ngFor="let row of tableData; let i = index">
<th *ngIf="i == 0" [attr.rowspan]="tableData!.length">Vrednosti</th>
<td class="text-center" *ngFor="let col of row; let j = index">
<div class="text-overflow">
{{col}}
</div>
</td>
</tr>
</tbody>
</table>
<div class="container-fluid text-offwhite belowColumn">
<div class="row ">
<div class="col-sm-3 slider rounded" style="border:1px solid var(--ns-primary)">
<div class="text-center pt-3 pb-0 mb-0"><b>{{testSetDistribution}}%</b> : <b>{{100-testSetDistribution}}%</b></div>
<div class="text-center pt-0 mt-0">Trening
<mat-slider min="10" max="90" step="10" [(ngModel)]="testSetDistribution" (input)="updateTestSet($event)"></mat-slider>
Test</div>
</div>
<div class="col-sm-3 slider rounded" style="border:1px solid var(--ns-primary);margin-left: 10px;">
<div class="text-center text-offwhite justify-content-center align-items-center">
<mat-checkbox class="pt-4" color="accent" >Nasumicni redosled podataka</mat-checkbox>
</div>
</div>
<div class="col-sm-2 rounded">
<mat-form-field appearance="fill" class="align-items-center justify-content-center pt-3 w-100">
<mat-label>Tip problema</mat-label>
<mat-select value="ToDo1">
<mat-option value="ToDo1">Regresioni</mat-option>
<mat-option value="ToDo2">Binarni-Klasifikacioni</mat-option>
<mat-option value="ToDo3">Multi-Klasifikacioni</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="col-sm-2 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>
<mat-option *ngFor="let item of dataset?.columnInfo" [value]="item.columnName">{{item.columnName}}</mat-option>
</mat-select>
</mat-form-field>
</div>
<div class="col-sm-1 d-flex align-items-center justify-content-center">
<button mat-button (click)="ok()" class="bottom-button text-offwhite rounded-bottom">
<div class="f-row" style="justify-content: space-around;">
<div>Potvrdi</div>
<div class="icon-double pt-1">
<mat-icon>check</mat-icon>
<mat-icon>check</mat-icon>
</div>
</div>
</button>
</div>
</div>
</div>
|
