在 chart.js 数据和标签字段中使用数组值

Posted 2023-02-22

【中文标题】在 chart.js 数据和标签字段中使用数组值

【英文标题】：using array values in chart.js data and label field

【发布时间】：2016-12-16 15:01:04

【问题描述】：

我希望将数组的值传递给 chart.js 数据集的数据和标签字段。

这里是 ajax 调用成功获取 json 数据的代码。我获取 json 数据并将其存储到一个数组中。

Data = jQuery.parseJSON(result);
var count = Data.length;
var counter = 0;
while(count > 0) 
    LabelResult[counter] =[Data[counter].TIME];
    counter++;
    count --;

现在我希望将此标签值用于标签字段。

var myChart = new Chart(ctx, 
    type: 'bar',
    data: 
        labels: [LabelResult],
        datasets: [
            label: '# of Votes',
            data: [DataResult],
            borderWidth: 1
        ]
        
);

但似乎有一些问题，数据没有在图表上呈现

【问题讨论】：

值在 LabelResult[counter] =[Data[counter].TIME] 处被插入到 LabelResult；

是的，这就是它们的声明方式 var LabelResult = []; var DataResult = [];

它看起来好像只有一个标签具有所有数组值，如堆栈。

【参考方案1】：

LabelResult 是一个数组，改变

labels: [LabelResult]

到

labels: LabelResult

还有：

data: [DataResult]

到

data: DataResult

喜欢：

var myChart = new Chart(ctx, 
    type: 'bar',
    data: 
        labels: LabelResult,
        datasets: [
            label: '# of Votes',
            data: DataResult,
            borderWidth: 1
        ]
        
);

【讨论】：

如果它似乎工作但现在在标签的情况下：LabelResult 但在数据的情况下：DataResult

【参考方案2】：

我认为您可以尝试删除一些括号。

while(count > 0)
     LabelResult[counter] = Data[counter].TIME; // here removed brackets
      counter++;
      count --;
    

和

data: 
    labels: LabelResult, // here removed brackets
    datasets: [
        label: '# of Votes',
        data: DataResult, // here removed brackets
        borderWidth: 1
    ]
,  

我希望这会奏效。

【讨论】：

如果它似乎工作但现在在标签的情况下：LabelResult 但在数据的情况下：DataResult