I'm working on an angular app and using ngx-charts, after debugging and searching online for few moments I couldn't find how to change the color palette on the charts.
The default angular color palette looks like the following:
Do you guys know how to change the color palette on the ngx-charts?
Any help is much appreciated, thank you!
After debugging for a while I found the solution:
So here are the steps:
Step 1 : On my .ts file I added a variable with the colors I needed
colorScheme = {
domain: ['#5AA454', '#A10A28', '#C7B42C', '#AAAAAA']
};
Step 2: on the .html file I called that variable inside the [scheme]="colorScheme" Property
<ngx-charts-pie-chart
[results]="chartData.pieChartData.chartPoints"
[legend]="chartData.chartOptions.showLegend"
[explodeSlices]="chartData.chartOptions.explodeSlices"
[labels]="true"
**[scheme]="colorScheme"**
[tooltipDisabled]="!chartData.chartOptions.showToolTip"
[doughnut]="chartData.chartOptions.donut"
aria-hidden="true">
</ngx-charts-pie-chart>
Good luck!