1

.json 文件：

[{
    "key_as_string": "2017-05-09",
    "doc_count": 1874
}, {
    "key_as_string": "2017-05-10",
    "doc_count": 2680
}, {
    "key_as_string": "2017-05-11",
    "doc_count": 2717
}, {
    "key_as_string": "2017-05-12",
    "doc_count": 2147
}, {
    "key_as_string": "2017-05-13",
    "doc_count": 984
}, {
    "key_as_string": "2017-05-14",
    "doc_count": 1302
}, {
    "key_as_string": "2017-05-15",
    "doc_count": 2217
}

我不知道如何在 HighChart 上使用对象数据

当我使用它时

 $.getJSON('/data/user_signedup.json', function(data) {

     options.series[0].name = "NewUser"
     options.series[0].data = data;


     console.log("series", options.series);
     var chart = new Highcharts.Chart(options);
 });

然后它什么都不起作用：所以我想知道如何使用对象数据集（key_as_string vlaue，匹配 x 值）
（doc_count vlaue，匹配 y 值）

我只能通过制作数字数组来绘制 y.value 

$.getJSON('/data/user_signedup.json', function(data) {

    options.series[0].name = "NewUser"
    options.series[0].data =[];
    data.forEach(function(item){
      options.series[0].data.push(item.doc_count)
    })
    console.log("series", options.series);
    var chart = new Highcharts.Chart(options);
});

图表选项设置

$(document).ready(function() {

var options = {
    chart: {
        renderTo: 'container',
        type: 'spline'
    },
    title: {
        text: 'Daily New User'
    },

    subtitle: {
        text: ' 2017-05-09 ~2017-06-08'
    },
    yAxis: {
          title: {
              text: 'Number of new Users'
          }
      },
    xAxis: {
        type: 'datetime',
        dateTimeLabelFormats: { // don't display the dummy year
            month: '%e. %b',
            year: '%b'
        },
        title: {
              text: 'Date'
          }
      },
      legend: {
          layout: 'vertical',
          align: 'right',
          verticalAlign: 'middle'
      },
    tooltip: {
    headerFormat: '<b>{series.name}</b><br>',
    pointFormat: '{point.x}: {point.y}명',
    // maincontentText: Highcharts.dateFormat('%A, %b %e, %Y', this.key_as_string) + ':<br/> ' +
    //                             this.doc_count + ' visits'
},

plotOptions: {
  series: {
     allowPointSelect: true
   }
},

    series: [{},{},{}]
};
4

1 回答 1

0

您可以通过使用 json 设置数据数组来传递自定义数据。对于 x 轴点，使用namekey，对于 y 轴点，使用ykey。

尝试这个：

$.getJSON('/data/user_signedup.json', function(data) {

    options.series[0].name = "NewUser"
    options.series[0].data =[];
    data.forEach(function(item){
      options.series[0].data.push({name:key_as_string,y:item.doc_count})
    })
    console.log("series", options.series);
    var chart = new Highcharts.Chart(options);
});

并将 highchart 配置更新为：

 xAxis: {
            type: 'category'
}
于 2017-06-26T12:39:30.217 回答