Question

我在仪表板上的页面上已加载 60多个图表。在台式机上，它可以正常工作，但在移动设备上，偶尔重新加载所有图表将消失，必须重新加载才能显示。

如果我删除了大多数图表，这个问题似乎就消失了。

是否有使用Charts.js加载60多个图表的正确方法？

有什么建议吗？

以下是我的设置示例：

new Chart(document.getElementById("doughnut-chart"), {
type: 'doughnut',
data: {
labels: ["Seeker", "Rock", "Examiner", "Uniter", "Counselor"],
datasets: [
{
label: "",
backgroundColor: ["#ff4757", "#8e44ad","#3c40c6","#2ed573","#f9ca24"],
data: [seekerNum, rockNum, examinerNum, uniterNum, counselorNum]
}
]
},
options: {
maintainAspectRatio: false,
beginAtZero: true,
title: {
display: true,
text: 'Your Personality Score'
}
}
});

前端：

<div class="col-lg-6 col-sm-12">
<p class='largeBodyText'> Chart #1: </p>

<canvas id="doughnut-chart" width="1000" height="1000"></canvas>

</div>

Answer 1

我的解决方案是将60多个图表分成3页。我很想知道错误的原因，但将它们分开完全可以解决加载问题。如果有人知道Charts.js推荐的一页上的最大图表，请随时分享！

Charts.JS-图表太多？ -加载问题

1 个答案: