diff options
Diffstat (limited to 'frontend/src')
6 files changed, 40 insertions, 19 deletions
diff --git a/frontend/src/app/_elements/annvisual/annvisual.component.ts b/frontend/src/app/_elements/annvisual/annvisual.component.ts index ff5b45d6..8588537e 100644 --- a/frontend/src/app/_elements/annvisual/annvisual.component.ts +++ b/frontend/src/app/_elements/annvisual/annvisual.component.ts @@ -19,13 +19,13 @@ export class AnnvisualComponent implements OnInit { let hiddenlayerstring:string=''; let digraphstring:string='digraph {'; - for(let i=0;i<this.model.inputNeurons;i++) + for(let i=0;i<this.model.inputColumns.length;i++) { inputlayerstring=inputlayerstring+'i'+i+','; } inputlayerstring=inputlayerstring.slice(0,-1); - digraphstring=digraphstring+'->'; + digraphstring=digraphstring+inputlayerstring+'->'; for(let j=0;j<this.model.hiddenLayers;j++) { @@ -33,15 +33,18 @@ export class AnnvisualComponent implements OnInit { { hiddenlayerstring=hiddenlayerstring+'h'+j+'_'+i+','; } - hiddenlayerstring=hiddenlayerstring.slice(0,1); + hiddenlayerstring=hiddenlayerstring.slice(0,-1); digraphstring=digraphstring+hiddenlayerstring+'->'; hiddenlayerstring=''; } digraphstring=digraphstring+'o}'; - alert(digraphstring); + graphviz('#graph').renderDot(digraphstring); } - + //'digraph {i0,i1,i2->h1,h2,h3->h21,h22,h23->o}' } + + + diff --git a/frontend/src/app/_elements/reactive-background/reactive-background.component.ts b/frontend/src/app/_elements/reactive-background/reactive-background.component.ts index 8294a8a5..980e3e6f 100644 --- a/frontend/src/app/_elements/reactive-background/reactive-background.component.ts +++ b/frontend/src/app/_elements/reactive-background/reactive-background.component.ts @@ -1,4 +1,4 @@ -import { Component, OnInit } from '@angular/core'; +import { Component, Input, OnInit } from '@angular/core'; @Component({ selector: 'app-reactive-background', @@ -7,13 +7,17 @@ import { Component, OnInit } from '@angular/core'; }) export class ReactiveBackgroundComponent implements OnInit { - numPoints: number = 450; - speed: number = 0.001; // 0-1 - rotateInterval: number = 1000; - maxSize: number = 6; + @Input() numPoints: number = 450; + @Input() speed: number = 0.001; // 0-1 + @Input() maxSize: number = 6; - minDistance: number = 0.07; //0-1 - cursorDistance: number = 0.07; + @Input() minDistance: number = 0.07; //0-1 + @Input() cursorDistance: number = 0.07; + + @Input() bgColor: string = '#222277'; + @Input() lineColor: string = '#ffffff'; + @Input() pointColor: string = '#ffffff'; + @Input() cursorLineColor: string = '#ff0000'; private points: Point[] = []; @@ -68,7 +72,7 @@ export class ReactiveBackgroundComponent implements OnInit { if (!this.ctx || !this.canvas) return; this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height); - this.ctx.fillStyle = "#222277"; + this.ctx.fillStyle = this.bgColor; this.ctx.fillRect(0, 0, this.width, this.height); this.points.forEach((point, index) => { @@ -90,7 +94,7 @@ export class ReactiveBackgroundComponent implements OnInit { const dist = this.distance(p.x, p.y, otherPoint.x, otherPoint.y); if (dist < this.minDistance) { const h = HEX[Math.round((1 - dist / this.minDistance) * 16)] - this.ctx!.strokeStyle = '#ffffff' + h + h; + this.ctx!.strokeStyle = this.lineColor + h + h; this.ctx!.beginPath(); this.ctx!.moveTo(p.x * this.width, p.y * this.height); this.ctx!.lineTo(otherPoint.x * this.width, otherPoint.y * this.height); @@ -102,7 +106,7 @@ export class ReactiveBackgroundComponent implements OnInit { } drawPoint(p: Point) { - this.ctx!.fillStyle = '#ffffff'; + this.ctx!.fillStyle = this.pointColor; this.ctx!.beginPath(); this.ctx!.arc(p.x * this.width, p.y * this.height, p.size, 0, 2 * Math.PI); this.ctx!.fill(); @@ -137,8 +141,8 @@ export class ReactiveBackgroundComponent implements OnInit { p.y -= ((my - p.y) / distToCursor) / 500; const grd = this.ctx!.createLinearGradient(p.x * this.width, p.y * this.height, mx * this.width, my * this.height); - grd.addColorStop(0, '#ff0000ff'); - grd.addColorStop(1, '#ff000000'); + grd.addColorStop(0, this.cursorLineColor + 'ff'); + grd.addColorStop(1, this.cursorLineColor + '00'); this.ctx!.strokeStyle = grd; this.ctx!.beginPath(); this.ctx!.moveTo(p.x * this.width, p.y * this.height); diff --git a/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts index f6b78ded..b75decf2 100644 --- a/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts +++ b/frontend/src/app/_pages/filter-datasets/filter-datasets.component.ts @@ -32,9 +32,18 @@ export class FilterDatasetsComponent implements OnInit { newDataset.isPublic = false; newDataset.lastUpdated = new Date(); newDataset.username = decodedToken.name; + let name=prompt("Unesite naziv dataset-a",newDataset.name); + newDataset.name=name as string; + if(name!=null && name!="") this.datasets.addDataset(newDataset).subscribe((response:string)=>{ console.log(response); + alert("Uspenso ste dodali dataset sa imenom "+newDataset.name); + },(error)=>{ + alert("Vec imate dataset sa istim imenom molim vas unesite drugo ime"); + + }); + }; } diff --git a/frontend/src/app/_pages/my-models/my-models.component.html b/frontend/src/app/_pages/my-models/my-models.component.html index b6926771..e2533d89 100644 --- a/frontend/src/app/_pages/my-models/my-models.component.html +++ b/frontend/src/app/_pages/my-models/my-models.component.html @@ -8,6 +8,7 @@ <div class="row"> <div class="col-sm-4" style="margin-bottom: 10px;" *ngFor="let model of myModels"> <app-item-model [model]="model"></app-item-model> + <app-annvisual align-items-center [model]="model" style="width: 100%;"></app-annvisual> <div style="width: 25%; margin: auto;"> <button mat-raised-button color="primary" (click)="deleteThisModel(model)" style="margin-top: 3px; width: 100%;">ObriĊĦi</button> diff --git a/frontend/src/app/app.component.html b/frontend/src/app/app.component.html index f0e563f4..daf93cc1 100644 --- a/frontend/src/app/app.component.html +++ b/frontend/src/app/app.component.html @@ -1,4 +1,6 @@ -<app-reactive-background></app-reactive-background> +<app-reactive-background [bgColor]="'#003459'" [lineColor]="'#00a8e8'" [pointColor]="'#cfeffb'" + [cursorLineColor]="'#888888'" [numPoints]="300"> +</app-reactive-background> <app-navbar></app-navbar> <div class="container h-100"> <router-outlet></router-outlet> diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts index 5d7af9d2..4efab17e 100644 --- a/frontend/src/app/app.module.ts +++ b/frontend/src/app/app.module.ts @@ -38,6 +38,7 @@ import { DatatableComponent } from './_elements/datatable/datatable.component'; import { FilterDatasetsComponent } from './_pages/filter-datasets/filter-datasets.component'; import { ReactiveBackgroundComponent } from './_elements/reactive-background/reactive-background.component'; import { ItemModelComponent } from './_elements/item-model/item-model.component'; +import { AnnvisualComponent } from './_elements/annvisual/annvisual.component'; @NgModule({ declarations: [ @@ -65,7 +66,8 @@ import { ItemModelComponent } from './_elements/item-model/item-model.component' DatatableComponent, FilterDatasetsComponent, ReactiveBackgroundComponent, - ItemModelComponent + ItemModelComponent, + AnnvisualComponent ], imports: [ BrowserModule, |