如何在Chart.js中设置默认图表类型与默认刻度类型？

嘿，我完全懂你想省掉重复代码的心情！你之前尝试的几个默认配置路径没踩对点子上，Chart.js的全局默认配置是有明确层级结构的，我来给你说正确的设置方法：

步骤1：设置全局默认图表类型 #

要让所有新建图表默认是line类型，直接给Chart.defaults.type赋值就行：

Chart.defaults.type = 'line';

步骤2：设置全局默认坐标轴刻度类型 #

你之前试的Chart.defaults.scales.type是无效的，因为Chart.js的坐标轴配置是按轴的标识（比如x、y）单独设置的，正确的写法是分别给x轴和y轴指定默认类型：

// 全局默认X轴为linear刻度
Chart.defaults.scales.x.type = 'linear';
// 全局默认Y轴为linear刻度
Chart.defaults.scales.y.type = 'linear';

完整示例 #

把这些全局配置放在所有图表初始化代码之前（比如页面脚本的开头），之后创建图表就可以用极简写法了：

// 先配置全局默认项
Chart.defaults.type = 'line';
Chart.defaults.scales.x.type = 'linear';
Chart.defaults.scales.y.type = 'linear';

// 现在创建图表只需传入上下文即可
const graph1 = new Chart(ctx1, {});
const graph2 = new Chart(ctx2, {});

// 如果某个图表需要覆盖默认配置，直接传对应参数就行
const customGraph = new Chart(ctx3, {
  type: 'bar', // 覆盖默认的line类型
  scales: {
    x: {
      type: 'category' // 覆盖默认的linear刻度
    }
  }
});

为什么之前的设置无效？ #

• Chart.defaults.scales.type：这个路径不存在，scales下是按轴ID（x、y等）来细分配置的，不能直接给整个scales设置type
• Chart.options.type：全局默认配置的根对象是Chart.defaults，不是Chart.options，后者不是全局默认的正确入口

内容的提问来源于stack exchange，提问作者DocWilco