如何更改条形图中标签的字体系列？

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/