填充

图表选项中的填充值可以用几种不同的格式提供。

数字

如果此值为数字，则将其应用于所有边 (左、上、右、下)。

例如，在图表的所有边定义 20px 填充

let chart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        layout: {
            padding: 20
        }
    }
});

{top, left, bottom, right} 对象

如果此值为对象，则 left 属性定义左侧填充。类似地，也可以指定 right、top 和 bottom 属性。省略的属性默认为 0。

假设你想在图表画布的左侧添加 50px 的填充，你可以执行以下操作

let chart = new Chart(ctx, {
    type: 'line',
    data: data,
    options: {
        layout: {
            padding: {
                left: 50
            }
        }
    }
});

{x, y} 对象

这是为左/右和上/下定义相同值的简写方式。

例如，在径向线性轴上进行 10px 左/右和 4px 上/下填充 刻度背景填充

let chart = new Chart(ctx, {
    type: 'radar',
    data: data,
    options: {
        scales: {
          r: {
            ticks: {
              backdropPadding: {
                  x: 10,
                  y: 4
              }
            }
        }
    }
});