Question

我来读取json文件以输出到highcharts。

我有一个highcharts字体，其值来自json，其格式如下：

scope.jsondata = [
    {
        "Name": "A",
        "Categories": "03.01",
        "Locate": "1",
        "Value": 30
    },
    {
        "Name": "A",
        "Categories": "03.02",
        "Locate": "1",
        "Value": 50
    },
    {
        "Name": "A",
        "Categories": "03.03",
        "Locate": "1",
        "Value": 60
    },
    {
        "Name": "A",
        "Categories": "03.04",
        "Locate": "1",
        "Value": 40
    },
    {
        "Name": "A",
        "Categories": "03.05",
        "Locate": "1",
        "Value": 70
    }
];

如何在angularJS中为jsondata嵌入这些值？

scope.render = function (data) {
    var target = element.find('#detail-usage-chart'),
        firstDate = {
            name: scope.jsondata.Name,
            data:  scope.jsondata.Vaule,
            color: '#f48d7f',
            type: 'area'
        },
        tempOption = {
            data: [10, 13, 17, 8, 11, 5, 11, 13 ,16, 18, 20, 13, 16, 21, 19],
            type: 'spline',
            yAxis: 1
        }
};

请提供一种合适的方法来嵌入来自json的数据。

Answer 1

区域图表期望其系列中的名称和数组包含值：
See here

所以你要做的只是一个快速的功能，以便以这种方式准备你的数据。例如：

var scope.readyValues = [];
for(var i=0;i<scope.jsondata.length;i++)
{
    scope.readyValues.push(scope.jsondata[i].Value);    
}

接下来，只需按照这种方式配置系列：

// .....chart options
series: [{
            name: scope.jsondata[0].Name,
            data: scope.readyValues
        }

如果scope.jsondata中有多个名称，则可以使用jquery map函数，也可以为每个名称创建一个数组。
因为你使用角度我建议你使用Highcharts-ng它更容易;）

读取json文件以输出到highcharts

1 个答案: