在折线图的水平（网格）线之间更改 space

Question

是否可以在水平（网格）线之间手动更改 space？设置 maintainAspectRatio: false,kinda 可以解决问题，但会使图形高度太窄。我看到有一个选项可以扩展现有图表类型

Chart.types.Line.extend({
// Passing in a name registers this chart in the Chart namespace in the same way
name: "LineAlt",
initialize: function(data){
    console.log('My Line chart extension');
    Chart.types.Line.prototype.initialize.apply(this, arguments);
}
});

// Creates a line chart in the same way
new Chart(ctx).LineAlt(data);

但我不知道如何捕捉和改变线之间的高度。我是 chartjs 的新手，可以这样做吗？任何帮助将非常感激。我正在尝试更改图形的高度或设置最大高度以使其在响应时看起来不会太大？

Answer 1

你可以传入选项。虽然没有直接设置网格线之间水平间距的选项，但您可以使用下面的（来自http://www.chartjs.org/docs/#getting-started-global-chart-configuration）

// Creates a line chart in the same way
new Chart(ctx).LineAlt(data, {
     scaleOverride: true,

     scaleSteps: 10,
     scaleStepWidth: 20,
     scaleStartValue: 0,       
});

请注意，您需要所有 4 个设置。

调整scaleStepWidth来控制间距。

在折线图的水平（网格）线之间更改 space

change space between horizontal (grid) lines for line chart

charts

chart.js