mirror of
https://github.com/akveo/ngx-admin.git
synced 2025-12-23 02:40:14 +01:00
refactor(charts): change color scheme for d3 charts
This commit is contained in:
parent
bdca59b793
commit
933881f69e
10 changed files with 70 additions and 128 deletions
|
|
@ -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],
|
||||
};
|
||||
});
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue