javascript - 如何将 for 循环集成到 Fusioncharts

Question

我想在我的 FusionChart 脚本中添加一个 for 循环，这样我就可以通过循环输入值。但到目前为止我做不到。请帮忙。这是代码。我该怎么做才能使这个循环工作？

FusionCharts.ready(function () {
    var revenueChart = new FusionCharts({
        type: 'column3d',
        renderAt: 'chartContainer',
        width: '500',
        height: '300',
        dataFormat: 'json',
        dataSource: {
            "chart": {
                "caption": "Monthly revenue for last year",
                "subCaption": "Harry's SuperMart",
                "xAxisName": "Month",
                "yAxisName": "Revenues (In USD)",
            },
            "data": [
                //for (var i = 0; i < ist.length; i++) {// this is where i want to add the loop

                {
                    "label": ist[0].MyProperty_Test_Customer_Id,
                    "value": parseFloat(ist[0].MyProperty_Test_Chargers)
                },
                {
                    "label": ist[1].MyProperty_Test_Customer_Id,
                    "value": parseFloat(ist[1].MyProperty_Test_Chargers)
                },
                {
                    "label": ist[2].MyProperty_Test_Customer_Id,
                    "value": parseFloat(ist[2].MyProperty_Test_Chargers)
                }
                //}

            ]
        }
    });
    revenueChart.render();
});

Answer 1

好的，所以 data 属性需要是一个数组。如果它在 so-called IIFE 内，您可以使用 for 循环实现此目的并让 IFFE 返回一个数组(请注意，您会将以下内容放入图表配置中):

"data": (function() {
    var data = [];

    for (var i = 0; i < ist.length; i++) {
        data.push({
            "label": ist[i].MyProperty_Test_Customer_Id,
            "value": parseFloat(ist[i].MyProperty_Test_Chargers)                
        })
    }

    return data;
})()

更好的是，使用 上面 的 for 循环创建您需要的数组 var revenueChart = new FusionCharts({...:

var chartData = [];

for (var i = 0; i < ist.length; i++) {
    chartData.push({
        "label": ist[i].MyProperty_Test_Customer_Id,
        "value": parseFloat(ist[i].MyProperty_Test_Chargers)                
    })
}

var revenueChart = new FusionCharts({
    ...
    data: chartData
    ...