Chart.js 在传递动态标签时不显示数据答案

【问题标题】：Chart.js not showing data when pass dynamic labelsChart.js 在传递动态标签时不显示数据
【发布时间】：2020-02-28 14:13:10
【问题描述】：

我正在使用时间刻度并将时刻日期值传递给标签。时间刻度需要一个整数（自纪元以来的毫秒数）、一个 Date 对象、一个用于标签值的 moment.js 对象。

当我将该数组转换为逗号分隔引号后将其传递给charts.js“标签”对象时，我有一个动态的标签数组，然后数据未显示在图表上。

        data: {
        labels: JSON.stringify(newDateArray),
        datasets: [{
            label: "My First dataset",
            data: [2, 3],
            backgroundColor: "rgba(255, 0, 0, 1)",
            fill: false,
        }]
    }

但是当我静态传递上述数组的输出时，图形开始正常工作。

        data: {
        labels: ["2020-02-25T19:00:00.000Z","2020-02-27T19:00:00.000Z"],
        datasets: [{
            label: "My First dataset",
            data: [2, 3],
            backgroundColor: "rgba(255, 0, 0, 1)",
            fill: false,
        }]
    }

我尝试了不同的方法将 JS 数组转换为逗号分割字符串，然后传递动态标签，即 (["'" + newDateArray.join("','") + "'"]) 但没有奏效任何人。

这里是 jsfiddle，其中包含完整的 charts.js 代码。感谢您的所有帮助！

【问题讨论】：

不需要使用JSON.stringify，只需设置labels:newDateArray即可。
@LiuYu 请在答案中附上简短的细节，以便我将其标记为答案，谢谢！
我只知道 labels 应该是 array 就像 sample 一样。我找不到"rule"或api解释。

标签： javascript chart.js momentjs

【解决方案1】：

只将数组传递给标签而不是将数组转换为逗号分割字符串解决了这个问题。

【讨论】：

【解决方案2】：

'' 来自 node.js 控制器，我也花了一些时间来解决这个问题.. 工作代码示例供参考

                               <script>
                                   
                                    var vCenterSpaceData = ('<%-JSON.stringify(vCenterSpace)%>')
                                    var vCenterSpaceParsedData = JSON.parse(vCenterSpaceData)
                                    
                                    const formChartData = []
                                    const formChartLabels = []
    
                                    for(key in vCenterSpaceParsedData)
                                    {
                                        formChartData.push(vCenterSpaceParsedData[key]["Percentage"])
                                        formChartLabels.push(vCenterSpaceParsedData[key]["Date"])
                                    }
                                    //alert(formChartLabels)
                                    
                                    const zschart = new Chart(document.getElementById("chartjs-0"), {
                                        "type": "line",
                                        "data": {
                                            "labels": formChartLabels,
                                            "datasets": [{
                                                "label": "Usage in %",
                                                "data": formChartData,
                                                "fill": false,
                                                "borderColor": "rgb(75, 192, 192)",
                                                "lineTension": 0.1
                                            }]
                                        },
                                        "options": {}
                                    });
                                </script>

【讨论】：