refactor(charts): change color scheme for d3 charts

This commit is contained in:
KostyaDanovsky 2017-08-29 11:42:03 +03:00
parent bdca59b793
commit 933881f69e
10 changed files with 70 additions and 128 deletions

View file

@ -5,7 +5,6 @@ import { NbThemeService } from '@nebular/theme';
selector: 'ngx-d3-area-stack',
template: `
<ngx-charts-area-chart
[view]="view"
[scheme]="colorScheme"
[results]="multi"
[xAxis]="showXAxis"
@ -20,50 +19,34 @@ import { NbThemeService } from '@nebular/theme';
`,
})
export class D3AreaStackComponent {
multi = [
{
name: 'Germany',
series: [
{
name: '2010',
value: 7300000,
},
{
name: '2011',
value: 8940000,
},
],
},
{
name: 'USA',
series: [
{
name: '2010',
value: 7870000,
},
{
name: '2011',
value: 8270000,
},
],
},
{
name: 'France',
series: [
{
name: '2010',
value: 5000002,
},
{
name: '2011',
value: 5800000,
},
],
},
];
view: any[] = [700, 400];
multi = [{
name: 'Germany',
series: [{
name: '2010',
value: 7300000,
}, {
name: '2011',
value: 8940000,
}],
}, {
name: 'USA',
series: [{
name: '2010',
value: 7870000,
}, {
name: '2011',
value: 8270000,
}],
}, {
name: 'France',
series: [{
name: '2010',
value: 5000002,
}, {
name: '2011',
value: 5800000,
}],
}];
showLegend = true;
autoScale = true;
showXAxis = true;
@ -76,8 +59,9 @@ export class D3AreaStackComponent {
constructor(private theme: NbThemeService) {
this.theme.getJsTheme().subscribe(config => {
const colors: any = config.variables;
this.colorScheme = {
domain: (<any>config.variables.d3).areaStack,
domain: [colors.primaryLight, colors.infoLight, colors.successLight, colors.warningLight, colors.dangerLight],
};
});
}