aboutsummaryrefslogtreecommitdiff
path: root/frontend/src/app
diff options
context:
space:
mode:
Diffstat (limited to 'frontend/src/app')
-rw-r--r--frontend/src/app/_data/Model.ts48
-rw-r--r--frontend/src/app/app.component.html4
-rw-r--r--frontend/src/app/app.module.ts11
-rw-r--r--frontend/src/app/barchart/barchart.component.css6
-rw-r--r--frontend/src/app/barchart/barchart.component.html4
-rw-r--r--frontend/src/app/barchart/barchart.component.spec.ts25
-rw-r--r--frontend/src/app/barchart/barchart.component.ts54
-rw-r--r--frontend/src/app/scatterchart/scatterchart.component.css6
-rw-r--r--frontend/src/app/scatterchart/scatterchart.component.html4
-rw-r--r--frontend/src/app/scatterchart/scatterchart.component.spec.ts25
-rw-r--r--frontend/src/app/scatterchart/scatterchart.component.ts32
11 files changed, 212 insertions, 7 deletions
diff --git a/frontend/src/app/_data/Model.ts b/frontend/src/app/_data/Model.ts
index 810b347d..0768a374 100644
--- a/frontend/src/app/_data/Model.ts
+++ b/frontend/src/app/_data/Model.ts
@@ -39,21 +39,61 @@ export enum ANNType {
// removeOutliers
export enum Encoding {
Label = 'label',
- OneHot = 'one hot'
+ OneHot = 'one hot',
+ BackwardDifference = 'backward difference',
+ BaseN = 'baseN',
+ Binary = 'binary',
+ CatBoost = 'cat boost',
+ Count = 'count',
+ GLMM = 'glmm',
+ Hashing = 'hashing',
+ Helmert = 'helmert',
+ JamesStein = 'james stein',
+ LeaveOneOut = 'leave one out',
+ MEstimate = 'MEstimate',
+ Ordinal = 'ordinal',
+ Sum = 'sum',
+ Polynomial = 'polynomial',
+ Target = 'target',
+ WOE = 'woe',
+ Quantile = 'quantile'
}
export enum ActivationFunction {
+ // linear
+ Binary_Step = 'binaryStep',
+ Linear = 'linear',
+ // non-linear
Relu = 'relu',
+ Leaky_Relu = 'leakyRelu',
+ Parameterised_Relu = 'parameterisedRelu',
+ Exponential_Linear_Unit = 'exponentialLinearUnit',
+ Swish = 'swish',
Sigmoid = 'sigmoid',
Tanh = 'tanh',
- Linear = 'linear'
+ Softmax = 'softmax'
}
export enum LossFunction {
+ // binary classification loss functions
BinaryCrossEntropy = 'binary_crossentropy',
- MeanSquaredError = 'mean_squared_error'
+ HingeLoss = 'hinge_loss',
+ // multi-class classiication loss functions
+ CategoricalCrossEntropy = 'categorical_crossentropy',
+ KLDivergence = 'kullback_leibler_divergence',
+ // regression loss functions
+ MeanSquaredError = 'mean_squared_error',
+ MeanAbsoluteError = 'mean_absolute_error',
+ HuberLoss = 'Huber',
}
export enum Optimizer {
- Adam = 'adam'
+ Adam = 'Adam',
+ Adadelta = 'Adadelta',
+ Adagrad = 'Adagrad',
+ Ftrl = 'Ftrl',
+ Nadam = 'Nadam',
+ SGD = 'SGD',
+ SGDMomentum = 'SGDMomentum',
+ RMSprop = 'RMSprop'
} \ No newline at end of file
diff --git a/frontend/src/app/app.component.html b/frontend/src/app/app.component.html
index 35e5adb1..24828a06 100644
--- a/frontend/src/app/app.component.html
+++ b/frontend/src/app/app.component.html
@@ -1,4 +1,6 @@
<app-navbar></app-navbar>
<div class="container h-100">
<router-outlet></router-outlet>
-</div> \ No newline at end of file
+ <app-barchart></app-barchart>
+ <app-scatterchart></app-scatterchart>
+</div>
diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts
index 5aa405fb..7f076421 100644
--- a/frontend/src/app/app.module.ts
+++ b/frontend/src/app/app.module.ts
@@ -6,6 +6,8 @@ import { HttpClientModule } from '@angular/common/http';
import { MatSliderModule } from '@angular/material/slider';
import { MatIconModule } from '@angular/material/icon';
+import {NgChartsModule} from 'ng2-charts';
+
import { AppComponent } from './app.component';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { DatasetLoadComponent } from './_elements/dataset-load/dataset-load.component';
@@ -29,6 +31,8 @@ import { MyModelsComponent } from './_pages/my-models/my-models.component';
import { BrowseDatasetsComponent } from './_pages/browse-datasets/browse-datasets.component';
import { BrowsePredictorsComponent } from './_pages/browse-predictors/browse-predictors.component';
import { PredictComponent } from './_pages/predict/predict.component';
+import { ScatterchartComponent } from './scatterchart/scatterchart.component';
+import { BarchartComponent } from './barchart/barchart.component';
@NgModule({
declarations: [
@@ -49,7 +53,9 @@ import { PredictComponent } from './_pages/predict/predict.component';
MyModelsComponent,
BrowseDatasetsComponent,
BrowsePredictorsComponent,
- PredictComponent
+ PredictComponent,
+ ScatterchartComponent,
+ BarchartComponent
],
imports: [
BrowserModule,
@@ -61,7 +67,8 @@ import { PredictComponent } from './_pages/predict/predict.component';
MaterialModule,
ReactiveFormsModule,
MatSliderModule,
- MatIconModule
+ MatIconModule,
+ NgChartsModule
],
providers: [],
bootstrap: [AppComponent]
diff --git a/frontend/src/app/barchart/barchart.component.css b/frontend/src/app/barchart/barchart.component.css
new file mode 100644
index 00000000..c3634c9f
--- /dev/null
+++ b/frontend/src/app/barchart/barchart.component.css
@@ -0,0 +1,6 @@
+#divBarChart{
+ background-color: beige;
+ display: block;
+ width: 400px;
+ height: 200px;
+}
diff --git a/frontend/src/app/barchart/barchart.component.html b/frontend/src/app/barchart/barchart.component.html
new file mode 100644
index 00000000..48b7bd3e
--- /dev/null
+++ b/frontend/src/app/barchart/barchart.component.html
@@ -0,0 +1,4 @@
+<p>Bar chart:</p>
+<div id="divBarChart">
+ <canvas id="Barchart"> </canvas>
+</div> \ No newline at end of file
diff --git a/frontend/src/app/barchart/barchart.component.spec.ts b/frontend/src/app/barchart/barchart.component.spec.ts
new file mode 100644
index 00000000..8b346d1c
--- /dev/null
+++ b/frontend/src/app/barchart/barchart.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { BarchartComponent } from './barchart.component';
+
+describe('BarchartComponent', () => {
+ let component: BarchartComponent;
+ let fixture: ComponentFixture<BarchartComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ BarchartComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(BarchartComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/frontend/src/app/barchart/barchart.component.ts b/frontend/src/app/barchart/barchart.component.ts
new file mode 100644
index 00000000..def64b7d
--- /dev/null
+++ b/frontend/src/app/barchart/barchart.component.ts
@@ -0,0 +1,54 @@
+import { Component, OnInit } from '@angular/core';
+import {Chart} from 'node_modules/chart.js';
+
+@Component({
+ selector: 'app-barchart',
+ templateUrl: './barchart.component.html',
+ styleUrls: ['./barchart.component.css']
+})
+export class BarchartComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit(){
+ const myChart = new Chart("Barchart", {
+ type: 'bar',
+ data: {
+ labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
+ datasets: [{
+ label: 'Number of Votes',
+ data: [12, 19, 3, 5, 2, 3],
+ backgroundColor: [
+ 'rgba(255, 99, 132, 1)',
+ 'rgba(54, 162, 235, 1)',
+ 'rgba(255, 206, 86, 1)',
+ 'rgba(75, 192, 192, 1)',
+ 'rgba(153, 102, 255, 1)',
+ 'rgba(255, 159, 64, 1)'
+ ],
+ borderColor: [
+ 'rgba(255, 99, 132, 1)',
+ 'rgba(54, 162, 235, 1)',
+ 'rgba(255, 206, 86, 1)',
+ 'rgba(75, 192, 192, 1)',
+ 'rgba(153, 102, 255, 1)',
+ 'rgba(255, 159, 64, 1)'
+ ],
+ borderWidth: 1
+ }]
+ },
+ options: {
+ scales: {
+ y: {
+ beginAtZero: true
+ }
+ }
+ }
+
+
+ });
+
+
+ }
+
+}
diff --git a/frontend/src/app/scatterchart/scatterchart.component.css b/frontend/src/app/scatterchart/scatterchart.component.css
new file mode 100644
index 00000000..5735217e
--- /dev/null
+++ b/frontend/src/app/scatterchart/scatterchart.component.css
@@ -0,0 +1,6 @@
+#divScatterChart{
+ background-color: beige;
+ display: block;
+ width: 400px;
+ height: 200px;
+} \ No newline at end of file
diff --git a/frontend/src/app/scatterchart/scatterchart.component.html b/frontend/src/app/scatterchart/scatterchart.component.html
new file mode 100644
index 00000000..2b30fe1f
--- /dev/null
+++ b/frontend/src/app/scatterchart/scatterchart.component.html
@@ -0,0 +1,4 @@
+<p>Scatter chart:</p>
+<div id="divScatterChart">
+ <canvas id="ScatterCharts"> </canvas>
+</div> \ No newline at end of file
diff --git a/frontend/src/app/scatterchart/scatterchart.component.spec.ts b/frontend/src/app/scatterchart/scatterchart.component.spec.ts
new file mode 100644
index 00000000..1db81051
--- /dev/null
+++ b/frontend/src/app/scatterchart/scatterchart.component.spec.ts
@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { ScatterchartComponent } from './scatterchart.component';
+
+describe('ScatterchartComponent', () => {
+ let component: ScatterchartComponent;
+ let fixture: ComponentFixture<ScatterchartComponent>;
+
+ beforeEach(async () => {
+ await TestBed.configureTestingModule({
+ declarations: [ ScatterchartComponent ]
+ })
+ .compileComponents();
+ });
+
+ beforeEach(() => {
+ fixture = TestBed.createComponent(ScatterchartComponent);
+ component = fixture.componentInstance;
+ fixture.detectChanges();
+ });
+
+ it('should create', () => {
+ expect(component).toBeTruthy();
+ });
+});
diff --git a/frontend/src/app/scatterchart/scatterchart.component.ts b/frontend/src/app/scatterchart/scatterchart.component.ts
new file mode 100644
index 00000000..1da88fe7
--- /dev/null
+++ b/frontend/src/app/scatterchart/scatterchart.component.ts
@@ -0,0 +1,32 @@
+import { Component, OnInit } from '@angular/core';
+import {Chart} from 'node_modules/chart.js';
+
+@Component({
+ selector: 'app-scatterchart',
+ templateUrl: './scatterchart.component.html',
+ styleUrls: ['./scatterchart.component.css']
+})
+export class ScatterchartComponent implements OnInit {
+
+ constructor() { }
+
+ ngOnInit(){
+ const myChart = new Chart("ScatterCharts", {
+ type: 'scatter',
+ data: {
+ datasets: [{
+ label: 'Scatter Example:',
+ data: [{x: 1, y: 11}, {x:2, y:12}, {x: 1, y: 2}, {x: 2, y: 4}, {x: 3, y: 8},{x: 4, y: 16}, {x: 1, y: 3}, {x: 3, y: 4}, {x: 4, y: 6}, {x: 6, y: 9}],
+ backgroundColor: 'rgb(255, 99, 132)'
+ }]
+ },
+ options: {
+ scales: {
+ y: {
+ beginAtZero: true
+ }
+ }
+ }
+ });
+ }
+}