2016-09-14 22 views
0

次のコードを使用して、ハイチャートの折れ線グラフに3秒ごとに新しいポイントを追加しようとしています。しかし、それは新しいポイントを追加しません。 jsonから戻ってくるポイントが[x、y]のように正しいことを確認しました。 getjsonの部分がなく、[3,4]のような点を使用すると動作します。しかし、jsonを追加すると、jsonに渡すはずの新しいデータは追加されません。highcharts動的にポイントを追加する

var chart; // global   
     function requestData() { 
      var series = this.series[0]; 

     $.getJSON('url', 
       function(point){ 

     // add the point 

      series.addPoint(point); 

     // call it again after one second 

      setInterval(requestData, 3000); 

     }); 
     } 

私がrequestDataをロードする方法は次のとおりです.1つの静的ポイントを追加することで動作します。

chart: { 
      zoomType: 'x', 
      events: { 
      load: requestData 
     } 

機能が繰り返されないか、データを取得していないかの点で彼にデータを入れていないか、addpointが動作しない理由を任意のアイデア?

ロードの代わりにクリックを使用しても問題なく動作しました。定期的な積み込みがうまくいかないようです。

編集:フルチャートコード:

.getJSON('url2', 
    function(data){ 
    $('#container11').highcharts({ 
     chart: { 
      zoomType: 'x', 
      events: { 
      load: requestData 
     } 


     }, 
     title: { 
      text: '' 
     }, 
     subtitle: { 
      text: document.ontouchstart === undefined ? 
        'Click and drag in the plot area to zoom in' : 'Pinch the chart to zoom in' 
     }, 
     xAxis: { 
      type: 'time', 
      dateTimeLabelFormats: { 
      hour: '%H:%M', 
      } 
     }, 
     yAxis: { 
      title: { 
       text: 'test' 
      } 
     }, 
     legend: { 
      enabled: false 
     }, 
     plotOptions: { 
      area: { 
       fillColor: { 
        linearGradient: { 
         x1: 0, 
         y1: 0, 
         x2: 0, 
         y2: 1 
        }, 
        stops: [ 
         [0, Highcharts.getOptions().colors[0]], 
         [1, Highcharts.Color(Highcharts.getOptions().colors[0]).setOpacity(0).get('rgba')] 
        ] 
       }, 
       marker: { 
        radius: 2 
       }, 
       lineWidth: 1, 
       states: { 
        hover: { 
         lineWidth: 1 
        } 
       }, 
       threshold: null 
      } 
     }, 

     series: [{ 
      type: 'area', 
      name: 'name', 
      data: data 
     }] 
    }); 

})。

+0

関数 'requestData'は、ポイントをチャートに追加しますが、' ajaxRequest'の間隔を設定しています。 'setInterval(ajaxRequest、3000); 'は' setTimeout(requestData、3000)でなければなりません。 '。そうでない場合は、完全なコードを投稿すると役立ちます。 'requestData'は内部で' this'コンテキストをどのように取得しますか?この関数はオブジェクトの一部ですか? – Ejaz

+0

ありがとう、私のコードでは 'requestData'ですが、私はちょうどコピーエラーです。私はコードを編集しました。実際には、 'var series = this.series [0];'の代わりに 'series = chart.series [0]'を実行しようとしましたが、静的な追加ポイントを渡しませんでした。私は、この関数がチャートからロードされているので、 'this'がなぜ機能するのかと推測します。フルコードでは残りのチャートコードを意味しますか?私はメインの質問にコードの残りの部分を追加しました – Hans

+0

あなたはHighchartsのドキュメントを見ましたか?ドキュメント内でポイントを動的に追加する方法については、http://www.highcharts.com/docs/working-with-data/live-data –

答えて

0

私は 'var series = this.series [0];' after 'getjson'

関連する問題