如何更改條形圖中標簽的字體系列？

Question

我正在使用 Chart.js 庫創建圖表，現在我正在嘗試將標簽字體系列更改為蒙特塞拉特。 它適用於刻度，但不適用於標簽和 X 軸：

這是我的配置：

var doughnutChart = new Chart(ctx, {
  type: 'bar',
  data: {
    labels: ['Blue', 'Red', 'Yellow', 'Green'],
    datasets: [
      {
        backgroundColor: ['#059CFF', '#FF6384', '#FFD673', '#22CECE'],
        data: pieChartData[1].data,
      },
    ],
  },
  options: {
    responsive: false,
    legend: {
      display: false,
      labels: {
        fontFamily: 'Montserrat, sans-serif',
        fontColor: 'red'

      }
    },
    scales: {
      yAxes: [
        {
          ticks: {
            beginAtZero: true,
            fontFamily: 'Montserrat, sans-serif',
          },
        },
      ],
    },
  },
});

如何更改底部標簽的字體系列？

JSFiddle ： https://jsfiddle.net/t7bzg9aL/

Answer 1

看起來您缺少 x 軸字體設置：

var doughnutChart = new Chart(ctx, {
    ...

    scales: {
      ...
      xAxes: [
        {
          ticks: {
            fontFamily: 'Montserrat, sans-serif',
          },
        },
      ],
    },
  },
});

這是演示： https://jsfiddle.net/mbratch/wxgry4p2/1/

但是，如果這是所需的結果，您可以為整個圖表設置默認字體：

Chart.defaults.global.defaultFontFamily = 'Montserrat, sans-serif';

var doughnutChart = new Chart(ctx, {
    ...   // no need to set font family in here
});

演示： https://jsfiddle.net/mbratch/wxgry4p2/2/