From 763eaf066e3b831facd278c32f5c6241c57fa639 Mon Sep 17 00:00:00 2001 From: Sonja Galovic Date: Mon, 2 May 2022 20:01:29 +0200 Subject: Column-table: difolt kategorijska kolona uvek ostaje kategorijska, a numericku korisnik moze da menja. Dodata rotacija na dugmice za podesavanje. Zakomentarisan hasHeader i neka dodavanja na beku da ne bi javljalo kompajlersku. --- backend/api/api/Models/Dataset.cs | 2 +- backend/api/api/Services/FillAnEmptyDb.cs | 18 +++++++-------- frontend/src/app/_data/Dataset.ts | 6 ++--- .../column-table/column-table.component.css | 24 +++++++++++++++++-- .../column-table/column-table.component.html | 27 +++++++++++----------- .../column-table/column-table.component.ts | 15 ++++++++++-- 6 files changed, 62 insertions(+), 30 deletions(-) diff --git a/backend/api/api/Models/Dataset.cs b/backend/api/api/Models/Dataset.cs index 0faa43d5..a01f3cf7 100644 --- a/backend/api/api/Models/Dataset.cs +++ b/backend/api/api/Models/Dataset.cs @@ -22,7 +22,7 @@ namespace api.Models public DateTime dateCreated { get; set; } public DateTime lastUpdated { get; set; } public string delimiter { get; set; } - public bool hasHeader { get; set; } + //public bool hasHeader { get; set; } public ColumnInfo[] columnInfo { get; set; } public int rowCount { get; set; } diff --git a/backend/api/api/Services/FillAnEmptyDb.cs b/backend/api/api/Services/FillAnEmptyDb.cs index 062eada3..2690ba93 100644 --- a/backend/api/api/Services/FillAnEmptyDb.cs +++ b/backend/api/api/Services/FillAnEmptyDb.cs @@ -63,9 +63,9 @@ namespace api.Services dataset.dateCreated = DateTime.Now; dataset.lastUpdated = DateTime.Now; dataset.delimiter = ""; - dataset.hasHeader = true; + //dataset.hasHeader = true; dataset.columnInfo = new ColumnInfo[] { }; - dataset.columnInfo = new[] + /*dataset.columnInfo = new[] { new ColumnInfo( "PassengerId", true, 0, 446, 1, 891, 446, new string[]{ }), new ColumnInfo( "Survived", true, 0, 0.38383838534355164f, 0, 1, 0, new string[]{ }), @@ -79,7 +79,7 @@ namespace api.Services new ColumnInfo( "Fare", true, 0, 32.20420837402344f, 0, 512.3292236328125f, 14.45419979095459f, new string[]{ }), new ColumnInfo( "Cabin", false, 687, 0, 0, 0, 0, new string[]{ "B96 B98", "G6", "C23 C25 C27", "C22 C26", "F33", "F2", "E101", "D", "C78", "C93" }), new ColumnInfo( "Embarked", false, 2, 0.3815937042236328f, 0, 6, 0, new string[]{ "S", "C", "Q" }), - }; + };*/ dataset.rowCount = 891; dataset.nullCols = 3; dataset.nullRows = 708; @@ -179,8 +179,8 @@ namespace api.Services dataset.dateCreated = DateTime.Now; dataset.lastUpdated = DateTime.Now; dataset.delimiter = ""; - dataset.hasHeader = true; - dataset.columnInfo = new[] + //dataset.hasHeader = true; + /*dataset.columnInfo = new[] { new ColumnInfo( "Unnamed: 0", true, 0, 26969.5f, 0, 53939, 26969.5f, new string[]{ }), new ColumnInfo( "carat", true, 0, 0.7979397773742676f, 0.20000000298023224f, 5.010000228881836f, 0.699999988079071f, new string[]{ }), @@ -193,7 +193,7 @@ namespace api.Services new ColumnInfo( "x", true, 0, 5.731157302856445f, 0, 10.739999771118164f, 5.699999809265137f, new string[]{ }), new ColumnInfo( "y", true, 0, 5.73452615737915f, 0, 58.900001525878906f, 5.710000038146973f, new string[]{ }), new ColumnInfo( "z", true, 0, 3.538733720779419f, 0, 31.799999237060547f, 3.5299999713897705f, new string[]{ }) - }; + };*/ dataset.rowCount = 53940; dataset.nullCols = 0; dataset.nullRows = 0; @@ -297,15 +297,15 @@ namespace api.Services dataset.dateCreated = DateTime.Now; dataset.lastUpdated = DateTime.Now; dataset.delimiter = ""; - dataset.hasHeader = true; - dataset.columnInfo = new[] + //dataset.hasHeader = true; + /*dataset.columnInfo = new[] { new ColumnInfo( "sepal_length", true, 0, 5.8433332443237305f, 4.300000190734863f, 7.900000095367432f, 5.800000190734863f, new string[]{ }), new ColumnInfo( "sepal_width", true, 0, 3.053999900817871f, 2, 4.400000095367432f, 3, new string[]{ }), new ColumnInfo( "petal_length", true, 0, 3.758666753768921f, 1, 6.900000095367432f, 4.349999904632568f, new string[]{ }), new ColumnInfo( "petal_width", true, 0, 1.1986666917800903f, 0.10000000149011612f, 2.5f, 1.2999999523162842f, new string[]{}), new ColumnInfo( "class", false, 0, 0, 0, 0, 0, new string[]{ "Iris-setosa", "Iris-versicolor", "Iris-virginica" }), - }; + };*/ dataset.nullCols = 150; dataset.nullRows = 0; dataset.isPreProcess = true; diff --git a/frontend/src/app/_data/Dataset.ts b/frontend/src/app/_data/Dataset.ts index 525d371a..09e293fd 100644 --- a/frontend/src/app/_data/Dataset.ts +++ b/frontend/src/app/_data/Dataset.ts @@ -37,10 +37,10 @@ export class ColumnInfo { public min?: number, public max?: number ) { - if (isNumber) - columnType = ColumnType.numerical; + /*if (isNumber) + this.columnType = ColumnType.numerical; else - columnType = ColumnType.categorical; + this.columnType = ColumnType.categorical;*/ } } 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 5dc2e9ec..c3f5e4e8 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.css +++ b/frontend/src/app/_elements/column-table/column-table.component.css @@ -55,8 +55,8 @@ mat-slider { } #missingValuesHeader { - font-size: 12px; - line-height: 110% !important; + font-size: 13px; + line-height: 140% !important; } .verticalAlign { @@ -242,4 +242,24 @@ col:not(.col-disabled) { .col-first { background-color: rgb(1, 56, 86) !important; +} + + +/* mat-icon rotate */ + +.rotate { + animation: rotation 3s infinite linear; +} + +.rotate:hover { + cursor: pointer; +} + +@keyframes rotation { + from { + transform: rotate(0deg); + } + to { + transform: rotate(359deg); + } } \ No newline at end of file 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 42c43138..22c9841f 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -100,10 +100,11 @@ Tip - - - Kategorijski - Numerički +

Kategorijski

+ + + Kategorijski + Numerički @@ -111,14 +112,14 @@ Grafik - - + + Statistika - + Mean: {{colInfo.mean}}
Median: {{colInfo.median}}
Min: {{colInfo.min}}
@@ -128,7 +129,7 @@ Q3: {{colInfo.q3}}
--> -
+
{{uniqueValue}}
 @@ -138,7 +139,7 @@ Enkodiranje  - settings + settings @@ -152,8 +153,8 @@ -
Regulisanje
nedostajućih
vrednosti
- settings +
Nedostajuće
vrednosti
+ settings @@ -164,9 +165,9 @@
- + - + 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 4499196c..e4c41cd8 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -1,5 +1,5 @@ import { AfterViewInit, Component, ElementRef, EventEmitter, Input, OnInit, Output, ViewChildren } from '@angular/core'; -import Dataset from 'src/app/_data/Dataset'; +import Dataset, { ColumnType } from 'src/app/_data/Dataset'; import Experiment, { ColumnEncoding, Encoding, NullValReplacer, NullValueOptions } from 'src/app/_data/Experiment'; import { DatasetsService } from 'src/app/_services/datasets.service'; import { EncodingDialogComponent } from 'src/app/_modals/encoding-dialog/encoding-dialog.component'; @@ -23,6 +23,7 @@ export class ColumnTableComponent implements AfterViewInit { Object = Object; Encoding = Encoding; NullValueOptions = NullValueOptions; + ColumnType = ColumnType; tableData?: any[][]; nullValOption: string[] = []; @@ -35,7 +36,9 @@ export class ColumnTableComponent implements AfterViewInit { ngAfterViewInit(): void { this.datasetService.getMyDatasets().subscribe((datasets) => { - this.dataset = datasets[0]; + this.dataset = datasets[1]; + + this.setColumnTypeInitial(); this.experiment = new Experiment(); this.dataset.columnInfo.forEach(column => { this.columnsChecked.push(true); @@ -57,6 +60,14 @@ export class ColumnTableComponent implements AfterViewInit { }); } + setColumnTypeInitial() { + if (this.dataset != undefined) { + for (let i = 0; i < this.dataset.columnInfo.length; i++) { + this.dataset.columnInfo[i].columnType = (this.dataset.columnInfo[i].isNumber) ? ColumnType.numerical : ColumnType.categorical; + } + } + } + setDeleteColumnsForMissingValTreatment() { if (this.experiment != undefined) { this.experiment.nullValues = NullValueOptions.DeleteRows; -- cgit v1.2.3 From fdf0b814fcc3ffe890384720f4e3d8d38f502c37 Mon Sep 17 00:00:00 2001 From: Ognjen Cirkovic Date: Mon, 2 May 2022 20:28:08 +0200 Subject: Pomereni atributi iz experimenta u model na frontu i backu. Premesteni elementi za biranje test skupa iz column-table u form-model. --- backend/api/api/Models/Experiment.cs | 3 --- backend/api/api/Models/Model.cs | 3 +++ frontend/src/app/_data/Experiment.ts | 5 +---- frontend/src/app/_data/Model.ts | 7 ++++++- .../column-table/column-table.component.html | 14 -------------- .../_elements/column-table/column-table.component.ts | 7 ++----- .../app/_elements/form-model/form-model.component.css | 10 +++++++++- .../_elements/form-model/form-model.component.html | 19 ++++++++++++++++++- .../app/_elements/form-model/form-model.component.ts | 7 +++++-- 9 files changed, 44 insertions(+), 31 deletions(-) diff --git a/backend/api/api/Models/Experiment.cs b/backend/api/api/Models/Experiment.cs index f7bec083..cfff337c 100644 --- a/backend/api/api/Models/Experiment.cs +++ b/backend/api/api/Models/Experiment.cs @@ -16,9 +16,6 @@ namespace api.Models public string uploaderId { get; set; } public string[] inputColumns { get; set; } public string outputColumn { get; set; } - public bool randomOrder { get; set; } - public bool randomTestSet { get; set; } - public float randomTestSetDistribution { get; set; } public string nullValues { get; set; } public NullValues[] nullValuesReplacers { get; set; } public ColumnEncoding[] encodings { get; set; } diff --git a/backend/api/api/Models/Model.cs b/backend/api/api/Models/Model.cs index a9dbfbdd..f89c8e56 100644 --- a/backend/api/api/Models/Model.cs +++ b/backend/api/api/Models/Model.cs @@ -38,5 +38,8 @@ namespace api.Models public int epochs { get; set; } //public bool isTrained { get; set; } //public NullValues[] nullValues { get; set; } + public bool randomOrder { get; set; } + public bool randomTestSet { get; set; } + public float randomTestSetDistribution { get; set; } } } diff --git a/frontend/src/app/_data/Experiment.ts b/frontend/src/app/_data/Experiment.ts index 23fd77d4..ab87e3ca 100644 --- a/frontend/src/app/_data/Experiment.ts +++ b/frontend/src/app/_data/Experiment.ts @@ -13,10 +13,7 @@ export default class Experiment { public lastUpdated: Date = new Date(), public modelIds: string[] = [], - // Test set settings - public randomOrder: boolean = true, - public randomTestSet: boolean = true, - public randomTestSetDistribution: number = 0.1, //0.1-0.9 (10% - 90%) JESTE OVDE ZAKUCANO 10, AL POSLATO JE KAO 0.1 BACK-U + public encodings: ColumnEncoding[] = []//[{columnName: "", columnEncoding: Encoding.Label}] ) { } diff --git a/frontend/src/app/_data/Model.ts b/frontend/src/app/_data/Model.ts index 6281748c..185e2257 100644 --- a/frontend/src/app/_data/Model.ts +++ b/frontend/src/app/_data/Model.ts @@ -23,7 +23,12 @@ export default class Model extends FolderFile { public epochs: number = 5, // TODO add to add-model form public inputColNum: number = 5, public learningRate: LearningRate = LearningRate.LR1, - public layers: Layer[] = [new Layer()] + public layers: Layer[] = [new Layer()], + + // Test set settings + public randomOrder: boolean = true, + public randomTestSet: boolean = true, + public randomTestSetDistribution: number = 0.1 //0.1-0.9 (10% - 90%) JESTE OVDE ZAKUCANO 10, AL POSLATO JE KAO 0.1 BACK-U ) { super(name, dateCreated, lastUpdated); 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 42c43138..557b7be3 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.html +++ b/frontend/src/app/_elements/column-table/column-table.component.html @@ -209,20 +209,6 @@
-
- -
{{testSetDistribution}}% : {{100-testSetDistribution}}%
-
Trening - - Test
- -
-
-
- Nasumični redosled podataka -
-
-
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 4499196c..3f958aee 100644 --- a/frontend/src/app/_elements/column-table/column-table.component.ts +++ b/frontend/src/app/_elements/column-table/column-table.component.ts @@ -5,7 +5,6 @@ import { DatasetsService } from 'src/app/_services/datasets.service'; import { EncodingDialogComponent } from 'src/app/_modals/encoding-dialog/encoding-dialog.component'; import { MatDialog } from '@angular/material/dialog'; import { MissingvaluesDialogComponent } from 'src/app/_modals/missingvalues-dialog/missingvalues-dialog.component'; -import { MatSliderChange } from '@angular/material/slider'; import { MatCheckboxChange } from '@angular/material/checkbox'; import { CsvParseService } from 'src/app/_services/csv-parse.service'; @@ -28,7 +27,7 @@ export class ColumnTableComponent implements AfterViewInit { columnsChecked: boolean[] = []; //niz svih kolona - testSetDistribution: number = 70; + constructor(private datasetService: DatasetsService, public csvParseService: CsvParseService, public dialog: MatDialog) { //ovo mi nece trebati jer primam dataset iz druge komponente } @@ -145,9 +144,7 @@ export class ColumnTableComponent implements AfterViewInit { this.resetMissingValuesTreatment(selectedMissingValuesOption); }); } - updateTestSet(event: MatSliderChange) { - this.testSetDistribution = event.value!; - } + MissValsDeleteClicked(event: Event, replacementType: NullValueOptions, index: number) { diff --git a/frontend/src/app/_elements/form-model/form-model.component.css b/frontend/src/app/_elements/form-model/form-model.component.css index 8c279523..9b55a814 100644 --- a/frontend/src/app/_elements/form-model/form-model.component.css +++ b/frontend/src/app/_elements/form-model/form-model.component.css @@ -84,4 +84,12 @@ hr { .m-2 { max-height: 20 rem; -} \ No newline at end of file +} + +mat-slider { + width: 40%; +} + +.slider { + background-color: var(--ns-bg-dark-100); +} diff --git a/frontend/src/app/_elements/form-model/form-model.component.html b/frontend/src/app/_elements/form-model/form-model.component.html index 76601465..e51c2cac 100644 --- a/frontend/src/app/_elements/form-model/form-model.component.html +++ b/frontend/src/app/_elements/form-model/form-model.component.html @@ -85,7 +85,23 @@
+
+
+
+ +
{{testSetDistribution}}% : {{100-testSetDistribution}}%
+
Trening + + Test
+ +
+
+ Nasumični redosled podataka +
+ +
+
@@ -199,4 +215,5 @@
-
\ No newline at end of file + + diff --git a/frontend/src/app/_elements/form-model/form-model.component.ts b/frontend/src/app/_elements/form-model/form-model.component.ts index 2c78cd56..d5c497aa 100644 --- a/frontend/src/app/_elements/form-model/form-model.component.ts +++ b/frontend/src/app/_elements/form-model/form-model.component.ts @@ -4,7 +4,7 @@ import Shared from 'src/app/Shared'; import Experiment from 'src/app/_data/Experiment'; import Model, { Layer, ActivationFunction, LossFunction, LearningRate, LossFunctionBinaryClassification, LossFunctionMultiClassification, LossFunctionRegression, Metrics, MetricsBinaryClassification, MetricsMultiClassification, MetricsRegression, NullValueOptions, Optimizer, ProblemType, Regularisation, RegularisationRate, BatchSize } from 'src/app/_data/Model'; import { GraphComponent } from '../graph/graph.component'; - +import { MatSliderChange } from '@angular/material/slider'; @Component({ selector: 'app-form-model', @@ -15,7 +15,7 @@ export class FormModelComponent implements AfterViewInit { @ViewChild(GraphComponent) graph!: GraphComponent; @Input() forExperiment?: Experiment; @Output() selectedModelChangeEvent = new EventEmitter(); - + testSetDistribution: number = 70; constructor() { } ngAfterViewInit(): void { @@ -132,6 +132,9 @@ export class FormModelComponent implements AfterViewInit { this.updateGraph(); } } + updateTestSet(event: MatSliderChange) { + this.testSetDistribution = event.value!; + } -- cgit v1.2.3 From f9b96fc9234802ba78a64be094ebc4b4525cde8e Mon Sep 17 00:00:00 2001 From: Ognjen Cirkovic Date: Mon, 2 May 2022 20:30:57 +0200 Subject: Popravljena greska pri kompajliranju. --- backend/api/api/Services/FillAnEmptyDb.cs | 18 +++++++++--------- 1 file changed, 9 insertions(+), 9 deletions(-) diff --git a/backend/api/api/Services/FillAnEmptyDb.cs b/backend/api/api/Services/FillAnEmptyDb.cs index 2690ba93..b36b31d9 100644 --- a/backend/api/api/Services/FillAnEmptyDb.cs +++ b/backend/api/api/Services/FillAnEmptyDb.cs @@ -121,9 +121,9 @@ namespace api.Services experiment.uploaderId = "000000000000000000000000"; experiment.inputColumns = new string[] { "Embarked" }; experiment.outputColumn = "Survived"; - experiment.randomOrder = true; - experiment.randomTestSet = true; - experiment.randomTestSetDistribution = 0.30000001192092896f; + //experiment.randomOrder = true; + //experiment.randomTestSet = true; + //experiment.randomTestSetDistribution = 0.30000001192092896f; experiment.nullValues = "delete_rows"; experiment.nullValuesReplacers = new NullValues[] { }; experiment.encodings = new[] @@ -236,9 +236,9 @@ namespace api.Services experiment.uploaderId = "000000000000000000000000"; experiment.inputColumns = new string[] { "Unnamed: 0", "carat", "cut", "color", "clarity", "depth", "table", "x", "y", "z" }; experiment.outputColumn = "price"; - experiment.randomOrder = true; - experiment.randomTestSet = true; - experiment.randomTestSetDistribution = 0.30000001192092896f; + //experiment.randomOrder = true; + //experiment.randomTestSet = true; + //experiment.randomTestSetDistribution = 0.30000001192092896f; experiment.nullValues = "delete_rows"; experiment.nullValuesReplacers = new NullValues[] { }; experiment.encodings = new[] @@ -346,9 +346,9 @@ namespace api.Services experiment.uploaderId = "000000000000000000000000"; experiment.inputColumns = new string[] { "sepal_length", "sepal_width", "petal_length", "petal_width" }; experiment.outputColumn = "class"; - experiment.randomOrder = true; - experiment.randomTestSet = true; - experiment.randomTestSetDistribution = 0.20000000298023224f; + //experiment.randomOrder = true; + //experiment.randomTestSet = true; + //experiment.randomTestSetDistribution = 0.20000000298023224f; experiment.nullValues = "delete_rows"; experiment.nullValuesReplacers = new NullValues[] { }; experiment.encodings = new[] -- cgit v1.2.3