Chart.js-如何在x轴和y轴之间创建不同的全局配置

Question

我在网站的多个页面上使用Chart.js（https://www.chartjs.org/）来显示不同的图表

为了简化这些图表的添加和修改，我在脚本中添加了一些行，以与基本选项不同地配置Chart.js

Chart.defaults.scale.gridLines.display =  true
Chart.defaults.scale.gridLines.drawBorder =  true
Chart.defaults.scale.gridLines.color =  '#f5f5f5'
Chart.defaults.global.legend.display = true;
Chart.defaults.global.legend.labels.fontSize = 13
Chart.defaults.global.legend.labels.fontColor = '#373d3f'
....

问题是，在某些选项上，我希望x和y轴具有不同的值，例如drawOnChartArea选项

而且我不知道该怎么做，因为它不起作用：

Chart.defaults.scale.xAxes.gridLines.drawOnChartArea = false
Chart.defaults.scale.yAxes.gridLines.drawOnChartArea = true

因此，我仍然被迫在所有图形的选项中添加以下行：

options: {
  scales: {
    xAxes: [{
      gridLines: {
        drawOnChartArea: false,
      }
    }],
    yAxes: [{
      gridLines: {
        drawOnChartArea: true,
      }   
    }],
  },
}

如何在x轴和y轴之间创建不同的全局配置？

还有另一种方法可以为Chart.js创建全局配置（更清洁吗？更有效吗？）>

我在网站的多个页面上使用Chart.js（https://www.chartjs.org/）来显示不同的图表，为简化这些图表的添加和修改，我在脚本中添加了几行来进行配置...] >

Answer 1

Chart.defaults包含图表type的特定部分，其中包括scales选项。您可以使用console.log(Chart.defaults)查找外观。

例如Chart.defaults.bar定义如下：