JSONをHighCharts折れ線グラフに解析する方法は？

Question

私はリモートで、次のJSON文字列を解析しようとしています：

[{"name":"Object1","data":[1,2]},{"name":"Object2","data":[3,4]}] 

を、私は次のコードでそうやっている：チャートはレンダリングが、私はリモートで代用するときそうしない

$(function() { 
    var chart; 
    $(document).ready(function() { 
    var options = { 
     chart: { 
     renderTo: 'container', 
     type: 'line', 
     marginRight: 130, 
     marginBottom: 25 
     }, 
     title: { 
     text: 'hits by time', 
     x: -20 //center 
     }, 
     subtitle: { 
     text: 'Source:', 
     x: -20 
     }, 
     xAxis: { 
     categories: ['8am', '9am', '10am', '11am', '12pm', '1pm', 
     '2pm', '3pm', '4pm', '5pm', '6pm', '7pm'] 
     }, 
     yAxis: { 
     title: { 
      text: 'Hits' 
     }, 
     plotLines: [{ 
      value: 0, 
      width: 1, 
      color: '#808080' 
     }] 
     }, 
     tooltip: { 
     formatter: function() { 
      return '<b>'+ this.series.name +'</b><br/>'+ 
      this.x +': '+ this.y; 
     } 
     }, 
     legend: { 
     layout: 'vertical', 
     align: 'right', 
     verticalAlign: 'top', 
     x: -10, 
     y: 100, 
     borderWidth: 0 
     }, 
     series: [] 
    }; 

    $.getJSON('http://localhost:8080/jsonget', function(data) { 

     var series = { 
     data: [] 
     }; 

     $.each(data, function(i,item){ 
     alert(item.name); 
     series.name = item.name; 
     $.each(item.data, function(j,dataitem){ 
      alert(dataitem); 
      series.data.push(parseFloat(dataitem[i]));     
     }); 
     }); 

     options.series.push(series);  

     // Create the chart 
     var chart = new Highcharts.Chart(options); 
    }); 
    }); 
}); 

サイト上のCSV例の部分。

問題は何ですか？

Answer 1

私があなたのdataがうまく形成されていると言えます。したがって、これを行う必要があります。

var chart; 
$.getJSON('http://localhost:8080/UDPver/tagdiscover', function(data) { 
    // Populate series 
    options.series = data;  
    // Create the chart 
    chart = new Highcharts.Chart(options); 
}); 

Answer 2

問題はグラフが再描画されることです。したがって、（凡例から）無効になっている他の行がある場合、更新を行うと表示されます。 グラフに5行あります。毎秒更新されます。 凡例から、グラフから線の一部を無効/削除することができます。 しかし、上記の方法（それは動作します）を使用すると、完全なグラフが再描画され、すべての線が再び表示されます。 パラメータではなく、シリーズ（線）を更新するだけですか？

function doAjaxData() { 
      AjaxLoadingIcon(1); 
      $.ajax({ 
       url: getAjaxUrl(1), 
       dataType: 'json', 
       cache: false, 
       async: true, 
       success: function (json) { 
        AjaxLoadingIcon(0); 
        gchartOptions.series = []; 
        gchartOptions.series = json; 
        // gchart = new Highcharts.Chart(gchartOptions); 
        gchart.render(); 
        _updateTimer = window.setTimeout("doAjaxData()", 1000); 
        } 
       } 
      }); 
     } 

Answer 3

アートマ：この（動作しない）よう

。 dataitem[i]の代わりにちょうどdataitemと書いてください。うまくいくでしょう。

$.each(data, function(i,item){ 
    alert(item.name); 
    series.name = item.name; 
    $.each(item.data, function(j,dataitem){ 
     alert(dataitem); 
     series.data.push(parseFloat(dataitem[i]));     
    }); 
    });