折线，横条有效，但饼形图没有填充动态数据吗？

Question

我正在创建一个图表，用户可以选择生成不同的图表。当他们选择折线时，条形图上的数据会很好地填充。但是，当它们生成馅饼或甜甜圈时，没有数据被填充，我不确定为什么吗？

我查看了文档，上面写着馅饼和甜甜圈：

  

对于饼图，数据集需要包含一组数据点。数据点应为数字，Chart.js将所有数字合计并计算每个数字的相对比例。

我所有的图表都在字符串数组中以表示不同的图表类型，例如：

示例： ['1'，'2'，'3'，'4'，'5']

通过阅读，我认为我必须将字符串数组转换为整数，因此将它们转换为：

[1、2、3、4、5]

我尝试了ParseInt()和ParseFloat()都不起作用。

无济于事，饼图或甜甜圈图的数据仍未填充。标签工作正常，图表显示切片，但未填充数据，并且在控制台中未输出任何错误。任何建议将不胜感激。

这是我代码的一部分：

var testctx = document.getElementById("testctx");
var testChart = new Chart(testctx, {
    type: 'bar',
    data: {
        labels: ["Red", "Blue", "Yellow", "Green", "Purple", "Orange"],
        datasets: [{
            label: '# of Votes',
            data: [12, 19, 3, 5, 2, 3],
            backgroundColor: [
                'rgba(255, 99, 132, 0.2)',
                'rgba(54, 162, 235, 0.2)',
                'rgba(255, 206, 86, 0.2)',
                'rgba(75, 192, 192, 0.2)',
                'rgba(153, 102, 255, 0.2)',
                'rgba(255, 159, 64, 0.2)'
            ],
            borderColor: [
                'rgba(255,99,132,1)',
                'rgba(54, 162, 235, 1)',
                'rgba(255, 206, 86, 1)',
                'rgba(75, 192, 192, 1)',
                'rgba(153, 102, 255, 1)',
                'rgba(255, 159, 64, 1)'
            ],
            borderWidth: 1
        }]
    },
    options: {
        scales: {
            yAxes: [{
                ticks: {
                    beginAtZero:true
                }
            }]
        }
    }
});

// If I change this to any other chart type, such as line or bar the labels show up fine. However, If I change it to pie or doughnut the labels do not show up.
var testchartType = 'bar';

//console.log(testChart.config.type);

testChart.config.type = testchartType;

testChart.update();

以下是即时重新渲染的不同图表的屏幕截图：

我的控制台日志：