diff options
author | Nevena Bojovic <nenabojov@gmail.com> | 2022-04-19 21:06:28 +0200 |
---|---|---|
committer | Nevena Bojovic <nenabojov@gmail.com> | 2022-04-19 21:06:28 +0200 |
commit | ba8a9752a72a07840e12320dbb448f1391fdccad (patch) | |
tree | cd9a52c3f02dfbb2c9a24a90ccfea679c44472b3 /frontend/src/app/_elements/line-chart/line-chart.component.ts | |
parent | 5d5aef8ad980934b98c48391bf53fb41e2481b5d (diff) | |
parent | 3ee39c4a5c0dfccc4fcb429762e5a7cc026da4a0 (diff) |
Merge branch 'dev' of http://gitlab.pmf.kg.ac.rs/igrannonica/neuronstellar into dev
# Conflicts:
# frontend/src/app/app.module.ts
Diffstat (limited to 'frontend/src/app/_elements/line-chart/line-chart.component.ts')
-rw-r--r-- | frontend/src/app/_elements/line-chart/line-chart.component.ts | 57 |
1 files changed, 57 insertions, 0 deletions
diff --git a/frontend/src/app/_elements/line-chart/line-chart.component.ts b/frontend/src/app/_elements/line-chart/line-chart.component.ts new file mode 100644 index 00000000..7a06ecf5 --- /dev/null +++ b/frontend/src/app/_elements/line-chart/line-chart.component.ts @@ -0,0 +1,57 @@ +import { Component, OnInit } from '@angular/core'; +import { ChartOptions } from 'chart.js'; +import { BaseChartDirective } from 'ng2-charts'; + +@Component({ + selector: 'app-line-chart', + templateUrl: './line-chart.component.html', + styleUrls: ['./line-chart.component.css'] +}) +export class LineChartComponent implements OnInit { + + constructor() { } + + ngOnInit(): void { + } + lineChartData:Array<any> = [ + {data: [65, 59, 80, 81, 56, 55, 40], label: 'Series A'}, + {data: [28, 48, 40, 19, 86, 27, 90], label: 'Series B'}, + {data: [18, 48, 77, 9, 100, 27, 40], label: 'Series C'} + ]; + lineChartLabels: BaseChartDirective["labels"] = ['January', 'February', 'March', 'April', 'May', 'June']; + lineChartOptions = { + responsive: true, + }; + lineChartColors:Array<any> = [ + { // grey + backgroundColor: 'rgba(148,159,177,0.2)', + borderColor: 'rgba(148,159,177,1)', + pointBackgroundColor: 'rgba(148,159,177,1)', + pointBorderColor: '#fff', + pointHoverBackgroundColor: '#fff', + pointHoverBorderColor: 'rgba(148,159,177,0.8)' + }, + { // dark grey + backgroundColor: 'rgba(77,83,96,0.2)', + borderColor: 'rgba(77,83,96,1)', + pointBackgroundColor: 'rgba(77,83,96,1)', + pointBorderColor: '#fff', + pointHoverBackgroundColor: '#fff', + pointHoverBorderColor: 'rgba(77,83,96,1)' + }, + { // grey + backgroundColor: 'rgba(148,159,177,0.2)', + borderColor: 'rgba(148,159,177,1)', + pointBackgroundColor: 'rgba(148,159,177,1)', + pointBorderColor: '#fff', + pointHoverBackgroundColor: '#fff', + pointHoverBorderColor: 'rgba(148,159,177,0.8)' + } + ]; + lineChartLegend = true; + lineChartPlugins = []; + lineChartType = 'line'; + +} + + |