ハイチャート複数行ライブグラフ

Question

複数の行を作成するにはどうすればよいですか？このコードは1行でのみ動作します。グラフ上

は、どのように私はdspowerとuspower値を表示することができますか？唯一dspower値

を表示しましたかdata.php出力オンdata.php

<?php 
    $dspower = "65"; //dspower value is always different 
    $uspower = "109"; ////dspower value is always different 
    $ds1= json_decode($dspower); 
    $x = time() * 1000; 
    $a = array($x,$ds1); 
    $ret = $a; 
    echo json_encode($ret); 
?> 

上

<script> 
     var chart; // global 
     function requestData() { 
      $.ajax({ 
       url: 'data.php', 
       success: function(point) { 
        var series = chart.series[0], 
         shift = series.data.length > 20; // shift if the series is longer than 20 


        chart.series[0].addPoint(eval(point), true, shift); 


        setTimeout(requestData, 1000); 
       }, 
       cache: false 
      }); 
     } 

     $(document).ready(function() { 
      chart = new Highcharts.Chart({ 
       chart: { 
        renderTo: 'container', 
        defaultSeriesType: 'line', 
        events: { 
         load: requestData 
        } 
       }, 
       title: { 
        text: 'Live random data' 
       }, 


        legend: { 
      layout: 'vertical', 
      align: 'right', 
      verticalAlign: 'middle', 
      borderWidth: 0 
    }, 

       xAxis: { 
        type: 'datetime', 
        tickPixelInterval: 150, 
        maxZoom: 20 * 1000 
       }, 
       yAxis: { 
        minPadding: 0.2, 
        maxPadding: 0.2, 
        title: { 
         text: 'Signalli', 
         margin: 80 
        } 
       }, 
         series: [{}] 


      });  
     }); 

     </script> 

とPHPコードのようになります。[1472210448000,53.9]

Answer 1

1）あなたは、あなたのチャートで1シリーズを指定していますコード。

2）アップデートループで1つのシリーズのみを更新しています。

series: [{}] 

：

これを変更し、あなたのチャートの設定で両方のシリーズを説明するために

series: [{ 
    name: 'DSPOWER Series' 
},{ 
    name: 'USPOWER Series' 
}] 

これは、2つの名前付きシリーズを設定し、あなたは、それらのそれぞれにデータを追加することができます。あなたのdata.phpファイルで

、返された値の両方にアクセスし、それに応じて各シリーズを更新し、あなたのAjaxの成功の機能に続いて、両方の値

$return_data = array(
    'dspower' => $dspower_value, 
    'uspower' => $uspower_value 
); 
echo json_encode($return_data); 

を返す：

success: function(data) { 
    var series1 = chart.series[0], 
     series2 = chart.series[1], 
     shift = series1.data.length > 20, 
     parsedData = $.parseJSON(data); 

    series1.addPoint(parsedData.dspower, false, shift); 
    series2.addPoint(parsedData.uspower, false, shift); 
    chart.redraw(); 

} 

コードはおおよそのものであり、調整が必要な場合があります。