当图例显示为true时,Chartjs不呈现

fzsnzjdm  于 2023-08-05  发布在  Chart.js
关注(0)|答案(1)|浏览(194)

我尝试使用chartjs(pie)在屏幕上显示一些数据。在第一次加载时,屏幕工作得很好,但是当试图更新饼图时(使用创建它的相同代码),它只是消失了,并且不会在控制台中显示错误。
当我尝试更新图表数据时,下面的代码不起作用

chartList[0].destroy();
chartList[0] = new Chart($("#chart"), {
                type: "pie",
                data: {
                    datasets: [{
                        data: [15,20,30],
                        backgroundColor: ["rgba(255, 99, 132, 1)","rgba(255, 206, 86, 1)","rgba(54, 162, 235, 1)"],
                    }],
                    labels: ["Red","Yellow","Blue"],
                },
                options: {
                    legend: {
                        display: true,
                        position: 'bottom',
                    }
                }
            });

字符串
但如果我把“显示:false”,它正常呈现,但没有标题。

chartList[0].destroy();
chartList[0] = new Chart($("#chart"), {
                type: "pie",
                data: {
                    datasets: [{
                        data: [15,20,30],
                        backgroundColor: ["rgba(255, 99, 132, 1)","rgba(255, 206, 86, 1)","rgba(54, 162, 235, 1)"],
                    }],
                    labels: ["Red","Yellow","Blue"],
                },
                options: {
                    legend: {
                        display: false,
                        position: 'bottom',
                    }
                }
            });


第一个月
我已经尝试使用chartjs的更新版本,但问题仍然存在。

o0lyfsai

o0lyfsai1#

在调试chartjs几个小时后,我发现它在图例中丢失了一些标签参数。通知参数后,图表恢复到完美显示状态

options: {
  legend: {
    display: true,
    position: 'bottom',
    labels: {
      boxWidth: 40,
      padding: 10
    }
  }
}

字符串

相关问题