如何使用chart.js使30天的图表响应移动设备?

Question

我制作了一个图表，其中包括30天的缺席数据，我使用react-chartjs-2库制作，但结果没有响应，如何使其响应?

这是它在笔记本电脑上的样子:笔记本电脑图表

和这个如果在移动设备上看:手机版图表

这是我的代码:

this.state = {
loadFirst: true,
loadData: false,
filterYear: moment().format('YYYY'),
filterMonth: moment().format('MM'),
filtered: {
year: moment().format('YYYY'),
month: moment().format('MM')
},
data: {},
options: {
scales: {
yAxes: [
{
stacked: true,
ticks: {
beginAtZero: true
}
}
],
xAxes: [
{
stacked: true
}
]
}
}
}

:

<Bar data={data} options={options} />}

如何修复它?

Answer 1

由于chart.js仍然需要绘制它，因此您可以在移动设备上禁用图例以给图表提供更多的空间，因为它占用了大部分画布，或者您可以增加画布的大小