解析Json以使用Javascript呈现多行highstock图表

我试图解析来自R数据帧的类似JSON输出，以呈现为多行highstock图表。我不熟悉javascripting和highcharts，所以在阅读了highstocks的文档之后，我仍然无法按照我希望的方式呈现图形

我有一个R数据帧的输出，JSON文件的形式，（一个示例）——

我尝试的Javascript代码如下所示。尝试按服务器对json进行分组，使其符合highstock图表所需的格式。[[“名称”：“AAAA”，“数据”：[[9/1/2017455]，[9/2/2017457]，“名称”：“BBBB”，数据：[[9/1/2017486]，…]

var结果=[]；
/**
*在加载所有数据时创建图表
*@returns{undefined}
*/
函数createChart（）{
Highcharts.stockChart（‘容器’{
范围选择器：{
选定：4
},
亚克斯：{
标签：{
格式化程序：函数（）{
返回（this.value>0？'+'：''）+this.value+'%；
}
},
绘图线：[{
值：0，
宽度：2，
颜色：“银色”
}]
},
打印选项：{
系列：{
比较：'百分比'，
showInNavigator：对
}
},
工具提示：{
pointFormat:“{series.name}:{point.y}（{point.change}%）
”，
数值小数：2，
分裂：对
},
系列：结果
});
}
$.getJSON（'data.json'，函数（数据）{
结果=数据.reduce（函数（r，a）{
r[a.Server]=r[a.Server]| |[]；
r[a.Server].push（a）；
返回r；
}，Object.create（null））；
};
createChart（）；
})；

---

我创建了一个简单的示例，说明如何基于JSON数据创建多系列的Highstock图表：

function createChart(series) {
    Highcharts.stockChart('container', {
        series: series
    });
}

$.getJSON('https://api.myjson.com/bins/1d5580', function(data) {
    var series = [],
        name,
        newData = [];

    Highcharts.each(data[0], function(el, i) {
        if (!name) {
            name = el.Server;
        }
        if (name === el.Server) {
            newData.push({
                x: Number(moment(el.Date).format('X')),
                y: el.Hits
            });
        } else {
            series.push({
                name: name,
                data: newData
            });
            name = el.Sever;
            newData = [];
            newData.push({
                x: Number(moment(el.Date).format('X')),
                y: el.Hits
            });
        }
    });
    series.push({
        name: name,
        data: newData
    });
    createChart(series);
});

现场演示：

---

文档：

x数据（日期）自1970年以来需要以毫秒为单位给出。您可以使用

new Date（“此处的日期”）.getTIme（）

。谢谢！！！工作非常出色。我有超过100000个数据点，因此必须将plotOptions中的turboThreshold设置为0以禁用检查。快速提问，我的json在没有双精度选项时无法解析[[在开始或结束时。它只与[…]一起工作。我从服务器输出的json格式为[{}{}]。我必须手动将json更改为[{}{}}]]才能工作。我可以不使用[[{}{}]]而只使用[{}{}}}]。当我按原样加载它时，它不会呈现。感谢所有的指针！！您只需要更改“数据[0]'到'Highcharts.each'方法中的'data'。太棒了！！…我开始了解这些方法到底是如何工作的！！谢谢

function createChart(series) {
    Highcharts.stockChart('container', {
        series: series
    });
}

$.getJSON('https://api.myjson.com/bins/1d5580', function(data) {
    var series = [],
        name,
        newData = [];

    Highcharts.each(data[0], function(el, i) {
        if (!name) {
            name = el.Server;
        }
        if (name === el.Server) {
            newData.push({
                x: Number(moment(el.Date).format('X')),
                y: el.Hits
            });
        } else {
            series.push({
                name: name,
                data: newData
            });
            name = el.Sever;
            newData = [];
            newData.push({
                x: Number(moment(el.Date).format('X')),
                y: el.Hits
            });
        }
    });
    series.push({
        name: name,
        data: newData
    });
    createChart(series);
});