如何在 Chart.js 中为垂直刻度（X 轴）添加填充？答案

【问题标题】：How to add padding to the vertical scale (X-axis) in Chart.js?如何在 Chart.js 中为垂直刻度（X 轴）添加填充？
【发布时间】：2017-03-23 19:13:00
【问题描述】：

根据 Chart.js 2.3 版的“Tick Configuration”，只能为 Y 轴上的刻度设置填充（“水平刻度"):

填充 |编号 |10 |刻度标签和轴之间的填充。 注意：仅适用于水平刻度。

这就像一个魅力：

scales: {
    yAxes: [{
        ticks: {
            padding: 20,
        }
    }],
    xAxes: [{
        ticks: {
             // how to set padding here?
        }
    }]
}

但草案说，我还需要在 X 轴 上进行一些填充

如何使用 Chart.js 实现这一点？

也许可以使用插件？

【问题讨论】：

您能找到解决方案吗？我在同一条船上:-)
@JesseSchutt 不幸的是没有。
你是如何完成第 1 和 2 点之间的空间的？ @灯罩
@lampshade off-topic 评论，但是你能分享你的图表 JS conf，因为我正在尝试创建相同的图表。

标签： javascript chart.js padding chart.js2

【解决方案1】：

将值传递给'tickMarkLength' options--> scales--> xAxes--> gridLines

xAxes: [{
  gridLines: {
   tickMarkLength: 10
},

【讨论】：

【解决方案2】：

这里的游戏迟到了，但最新 Chart.js 的解决方案是将其包含在您的 options 参数中：

{
  scales: {
    xAxes: [
      {
        ticks: {
          padding: 20
        }
      }
    ]
  }
}

【讨论】：

【解决方案3】：

2.8版的正确答案如下：

options: {
    scales: {
        xAxes: [{
            ticks: {
                padding: 100
            }
        }], 
    }
}

【讨论】：