From de6c8de610ad141c3f2a69e4a7f46e7fa9364b36 Mon Sep 17 00:00:00 2001 From: nixa <4dmitr@gmail.com> Date: Tue, 17 May 2016 12:06:55 +0300 Subject: [PATCH] chartist.js componet update --- src/app/app.menu.ts | 2 +- .../components/chartistJs/chartistJs.scss | 7 ++-- .../chartistJs/chartistJs.service.ts | 33 +++++++++++-------- 3 files changed, 23 insertions(+), 19 deletions(-) diff --git a/src/app/app.menu.ts b/src/app/app.menu.ts index 9a6f659d..ed71ab2e 100644 --- a/src/app/app.menu.ts +++ b/src/app/app.menu.ts @@ -72,7 +72,7 @@ export const menuItems = [ // component: 'ChartJs', // }, { - title: 'ChartistJs', + title: 'Chartist.Js', component: 'ChartistJs', }, ] diff --git a/src/app/pages/charts/components/chartistJs/chartistJs.scss b/src/app/pages/charts/components/chartistJs/chartistJs.scss index 1ae4d625..940d0fb3 100644 --- a/src/app/pages/charts/components/chartistJs/chartistJs.scss +++ b/src/app/pages/charts/components/chartistJs/chartistJs.scss @@ -1,17 +1,14 @@ @import "../../../../theme/sass/conf/conf"; -.chartist h5 { - font-weight: $font-normal; -} .ct-area { fill-opacity: .5; } .ct-label{ - color: $default; + color: $default-text; opacity: 0.9; - fill: rgba(255,255,255,.9); + fill: $default-text; } .ct-chart .ct-label{ diff --git a/src/app/pages/charts/components/chartistJs/chartistJs.service.ts b/src/app/pages/charts/components/chartistJs/chartistJs.service.ts index ec0b4c4f..2d01b7b1 100644 --- a/src/app/pages/charts/components/chartistJs/chartistJs.service.ts +++ b/src/app/pages/charts/components/chartistJs/chartistJs.service.ts @@ -1,12 +1,15 @@ import {Injectable} from '@angular/core'; +import {BaThemeConfigProvider} from '../../../../theme'; + @Injectable() export class ChartistJsService { private _data = { simpleLineOptions: { + color: this._baConfig.get().colors.defaultText, fullWidth: true, - height: "300px", + height: '300px', chartPadding: { right: 40 } @@ -29,7 +32,7 @@ export class ChartistJsService { }, areaLineOptions: { fullWidth: true, - height: "300px", + height: '300px', low: 0, showArea: true }, @@ -44,7 +47,7 @@ export class ChartistJsService { }, biLineOptions: { - height: "300px", + height: '300px', high: 3, low: -3, showArea: true, @@ -64,7 +67,7 @@ export class ChartistJsService { }, simpleBarOptions: { fullWidth: true, - height: "300px" + height: '300px' }, multiBarData: { labels: ['Quarter 1', 'Quarter 2', 'Quarter 3', 'Quarter 4'], @@ -78,7 +81,7 @@ export class ChartistJsService { }, multiBarOptions: { fullWidth: true, - height: "300px", + height: '300px', stackBars: true, axisX: { labelInterpolationFnc: function (value) { @@ -119,7 +122,7 @@ export class ChartistJsService { }, stackedBarOptions: { fullWidth: true, - height: "300px", + height: '300px', stackBars: true, axisY: { labelInterpolationFnc: function (value) { @@ -132,8 +135,8 @@ export class ChartistJsService { }, simplePieOptions: { fullWidth: true, - height: "300px", - weight: "300px", + height: '300px', + weight: '300px', labelInterpolationFnc: function (value) { return Math.round(value / 12 * 100) + '%'; } @@ -144,8 +147,8 @@ export class ChartistJsService { }, labelsPieOptions: { fullWidth: true, - height: "300px", - weight: "300px", + height: '300px', + weight: '300px', labelDirection: 'explode', labelInterpolationFnc: function (value) { return value[0]; @@ -158,8 +161,8 @@ export class ChartistJsService { simpleDonutOptions: { fullWidth: true, donut: true, - height: "300px", - weight: "300px", + height: '300px', + weight: '300px', labelDirection: 'explode', labelInterpolationFnc: function (value) { return value[0]; @@ -167,10 +170,14 @@ export class ChartistJsService { } }; + constructor(private _baConfig:BaThemeConfigProvider) { + } + public getAll() { + console.log(this._data); return this._data; } - + public getResponsive(padding, offset) { return [ ['screen and (min-width: 1550px)', {