如何在Highchart中动态填充数据

时间:2016-05-13 07:54:33

标签: javascript jquery highcharts

我使用下面的代码显示条形图,我不知道如何在名称 y 字段中动态填充值。我是javascript数组中的名字和数据。

var productsName = [Laptop,Photoframe,PuzzleBox];
var productPrintCount = [56,24,10]

我不想在图表中硬编码名称和y值,我想动态填充,有人可以帮助我如何将这些值放在下面的图表中?

JSFiddle

 data: [{
        name: 'Laptop',
        y: 56
    }, {
        name: 'Photoframe',
        y: 24
    }, {
        name: 'PuzzleBox',
        y: 10
    }]

1 个答案:

答案 0 :(得分:2)

var productsName = ['Laptop', 'Photoframe', 'PuzzleBox'],
    productPrintCount = [56,24,10],
    mappingDataFn = function () {
            var resultData = [];
            $.each(productsName, function (key, value) {
                resultData.push({
                    'name': value,
                    'y': productPrintCount[key]
            });
        });
        return resultData;
    };
...
    series: [{
        name: 'Brands',
        colorByPoint: true,
        data: mappingDataFn()
    }]

这个想法: 映射函数中的数据。 这里是jsfiddle