javascript - 如何更改 Chart.js 图表中文本的颜色

Question

我使用 Chart.js 库来创建图表及其“chartjs-plugin-datalabels.js”插件。我的问题是如何更改图表上值的颜色，因为我无法使用 CSS 样式，因为它呈现为图像

Answer 1

更改标签颜色实际上就是 first example in the plugin documentation .

以下代码片段显示了更改图表中所有数据集的颜色:

new Chart(document.getElementById("chart"), {
  type: "pie",
  data: {
    labels: ['a', 'b', 'c', 'd'],
    datasets: [{
      data: [1, 2, 4, 8]
    }]
  },
  options: {
    maintainAspectRatio: false,
    plugins: {
      datalabels: {
        color: 'red'
      }
    }
  }
});

<script src="https://cdn.jsdelivr.net/npm/chart.js@2.9.1"></script>
<script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels"></script>
<canvas id="chart"></canvas>