时间戳

首页 > 解决方案 > 更改在 Angular ngx-charts 上设置的默认颜色

css - 更改在 Angular ngx-charts 上设置的默认颜色

问题描述

我正在开发一个角度应用程序并使用 ngx-charts，在调试和在线搜索了片刻之后，我找不到如何更改图表上的调色板。

默认的角度调色板如下所示： 在此处输入图像描述

你们知道如何更改 ngx-charts 上的调色板吗？

非常感谢任何帮助，谢谢！

标签： cssangularngx-charts

解决方案

经过一段时间的调试，我找到了解决方案：

所以这里是步骤：

第 1 步：在我的 .ts 文件中，我添加了一个包含所需颜色的变量

colorScheme = {
    domain: ['#5AA454', '#A10A28', '#C7B42C', '#AAAAAA']
  };

第 2 步：在 .html 文件中，我在 [scheme]="colorScheme" 属性中调用了该变量

<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>

祝你好运！

推荐阅读