【问题标题】:Retrieving JSON data for Highcharts with multiple series?检索具有多个系列的 Highcharts 的 JSON 数据?
【发布时间】:2013-09-20 07:15:15
【问题描述】:

我一直在查看大量示例,但似乎无法让我的代码提取数据。图表是空白的。

我有一个 php 文件,它提供以下内容:(date, value1, value2)

[
["2013-09-15 08:44:37",19.8,8.19],
["2013-09-15 08:47:37",18.4,7.81],
["2013-09-15 08:50:37",18.3,7.78],
["2013-09-15 08:53:37",18.1,7.77]
]

然后我有以下代码:

<!DOCTYPE html>
<head>
  <script src="js/jquery-1.10.2.min.js"></script>
  <script src="js/highcharts.js" type="text/javascript"></script>
  <script>
  var chart;
  $(document).ready(function() {
     var options = {
        chart: {
           renderTo: 'container',
           type: 'line',
        },
        title: {
        },
        xAxis: {
           type: 'datetime'
        },
        yAxis: {
        },
        series: [{
           name: 'val1',
           data: []
       }, {
           name: 'val2',
           data: []
        }]
     };
     $.getJSON('data_day.php', function(json) {
        val1 = [];
        val2 = [];
        $.each(json, function(key,value) {
        val1.push([value.time, value.val1]);
        val2.push([value.time, value.val2]);
        });

        options.series[0].data = val1;
        options.series[1].data = val2;
        chart = new Highcharts.Chart(options);
     });
  });
  </script>
</head>
<html>

我正在尝试使用 firebug 来查看我哪里出错了。如果我把

console.log(key,value) 

在$.each下我可以看到数据:

0 ["2013-09-15 08:50:37", 18.3, 7.78]
1 ["2013-09-15 08:53:37", 18.1, 7.77]
2 ["2013-09-15 08:56:37", 18.2, 7.8]

是不是有问题

val1.push([value.time, value.val1]);

options.series[0].data = val1;

更新:将其更改为这个并且现在可以使用。

val1.push([value[0], value[1]]);
val2.push([value[0], value[2]]);

【问题讨论】:

  • 我猜问题出在 value.time 和 value.val1 上。检查他们的价值观
  • 试试 value[0] 和 value[1]
  • 谢谢 - 这为我指明了正确的方向。查看更新 - 正在运行。
  • 编码愉快!你可以标记我的评论:)

标签: javascript php json highcharts


【解决方案1】:

根据 Pal 的评论 - 将其更改为:

val1.push([value[0], value[1]]);
val2.push([value[0], value[2]]);

【讨论】:

    猜你喜欢
    • 2013-03-17
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-12-08
    • 2012-06-03
    • 1970-01-01
    相关资源
    最近更新 更多