我正在使用最新的chart.js库来生成没有比例尺的折线图,但是存在填充问题并且顶部和底部点被切断.我看不到填充画布的任何选项.
我的配置如下.
var config = {
type: 'line',data: {
labels: ["January","February","March","April","May","June","July"],datasets: [{
label: "Sales",data: [10,20,50,25,60,12,48],fill: true,lineTension: 0.25,borderColor: "#558aeb",backgroundColor: "#558aeb"
}]
},options: {
responsive: true,legend: {
display: false
},tooltips: {
mode: 'label'
},hover: {
mode: 'dataset'
},scales: {
xAxes: [{
display: false
}],yAxes: [{
display: false
}]
}
}
};
解决方法
我相信你的问题不是填充,但我可能是错的.在我看来,你的问题是自动检测可绘制区域的高度,当你的数据中的最大数字是好的和圆形时,如60.当最大数量为61,62等时,尝试查看问题是否仍然存在.因此,我建议您烹饪数据,以免发生此类问题.如果数据烹饪不是一个选项,请尝试明确定义y轴中的最大刻度,以使其略高于数据中的最大数量.在您的情况下,尝试使用此：
yAxes: [{
display: false,ticks: {
max: 62
}
}]
因此,您需要计算数据中的最大数量并添加一些小的数据,以便明确定义将消除意外裁剪的最大值.有人可以有更好的理解和解决方案,但这是我能想到的选择.当然,那就是烹饪你的数据.
