diff options
Diffstat (limited to 'frontend/src')
4 files changed, 43 insertions, 70 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 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 e12065a3..9a8cbeee 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"); diff --git a/frontend/src/app/_elements/metric-view/metric-view.component.ts b/frontend/src/app/_elements/metric-view/metric-view.component.ts index fbca2edf..65b1ef9b 100644 --- a/frontend/src/app/_elements/metric-view/metric-view.component.ts +++ b/frontend/src/app/_elements/metric-view/metric-view.component.ts @@ -16,7 +16,7 @@ export class MetricViewComponent implements OnInit { history: any[] = []; - update(history: any[]) { + update(history: any[],totalEpochs:number) { const myAcc: number[] = []; const myMae: number[] = []; const myMse: number[] = []; @@ -29,7 +29,15 @@ export class MetricViewComponent implements OnInit { const myEpochs: number[] = []; this.history = history; this.history.forEach((metrics, epoch) => { - myEpochs.push(epoch + 1); + if(totalEpochs>100) + { + let epochEstimate=epoch*Math.round(Math.sqrt(totalEpochs)) + if(epochEstimate>totalEpochs) + epochEstimate=totalEpochs; + myEpochs.push(epochEstimate); + } + else + myEpochs.push(epoch + 1); for (let key in metrics) { let value = metrics[key]; //console.log(key, ':::', value, epoch); diff --git a/frontend/src/app/_pages/experiment/experiment.component.ts b/frontend/src/app/_pages/experiment/experiment.component.ts index 7cb5e7cd..398321f2 100644 --- a/frontend/src/app/_pages/experiment/experiment.component.ts +++ b/frontend/src/app/_pages/experiment/experiment.component.ts @@ -91,7 +91,7 @@ export class ExperimentComponent implements AfterViewInit { stat = stat.replace(/'/g, '"'); //console.log('JSON', this.trainingResult); this.history.push(JSON.parse(stat)); - this.metricView.update(this.history); + this.metricView.update(this.history,this.modelToTrain.epochs); } }); |