2012-07-09 126 views
0

我遵循以下指导创建生动的图表实时值: http://www.highcharts.com/documentation/how-to-use#live-chartsHighcharts显示在标签上

它赶上值和更新图表每一个“3”秒。它工作正常!

现在,是否有可能在标签上显示实时值?例如: enter image description here

这应该改变每个投票.....或者至少,显示在其他图表位置最后生成的值?

这是我的HTML/JS代码来生成图表:

<script type="text/javascript"> 
    var chart; // global 

    function requestData() { 
     $.ajax({ 
      url: 'live-server-data.php', 
      success: function(point) { 
       var series = chart.series[0], 
        shift = series.data.length > 30; // shift if the series is longer than 20 
       var series = chart.series[1], 
        shift = series.data.length > 30; // shift if the series is longer than 20 
       var series = chart.series[2], 
        shift = series.data.length > 30; // shift if the series is longer than 20 

       // add the point 
       chart.series[0].addPoint([point[0], point[1]], true, shift); 
       chart.series[1].addPoint([point[0], point[2]], true, shift); 
       chart.series[2].addPoint([point[0], point[3]], true, shift); 

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


    $(document).ready(function() { 
     chart = new Highcharts.Chart({ 
      chart: { 
       renderTo: 'container', 
       defaultSeriesType: 'spline', 
       events: { 
        load: requestData 
       } 
      }, 
      title: { 
       text: 'Live data' 
      }, 
      xAxis: { 
       type: 'datetime', 
       tickPixelInterval: 150, 
       maxZoom: 40 * 1000 
      }, 
      yAxis: { 
       minPadding: 0.5, 
       maxPadding: 0.5, 
       showLastLabel: true, 
       title: { 
        text: '', 
        margin: 1 
       } 
      }, 
     tooltip: { 
      formatter: function() { 
        return '<b>'+ this.series.name +'</b><br/>'+ 
        Highcharts.dateFormat('%H:%M:%S', this.x) +'<br/>'+ 
        'MDA: '+ this.y; 
      } 
     }, 
      series: [{ 
       name: 'Point1', 
       data: [] 
      }, { 
       name: 'Point2', 
       data: [] 
      }, { 
       name: 'Point3', 
       color: '#FF00FF', 
       data: [] 
      }] 
     });  
    });  
    </script> 

回答

1

这里是一个话题如何从highcharts论坛动态更改图例文本的链接。 [http://highslide.com/forum/viewtopic.php?f=9 &吨= 18805 & p值= 76061 &体液型=改变+系列+名#p76061] [1]

[1]:http://highslide.com/forum/viewtopic.php?f=9&t=18805&p=76061&hilit=change%20series%20name#p76061
希望能帮助到你!

+0

太棒了!我唯一的问题是以下一个:http://i48.tinypic.com/250ktmw.png 有没有办法刷新标签? 谢谢! – 2012-07-09 07:59:27

+0

将数据绑定到ajax调用成功之后,您可以使用最后添加的数据点的值重命名图例。 – 2012-07-09 08:51:43

+0

是的,我已经做到了,它可以正常工作... 如前一张图所示,问题是每次生成新值时,标签都会根据多少位数作为值。 这导致你在图片上看到的东西,所以标签覆盖了它自己! :( 现在我解决了把传说垂直... – 2012-07-09 10:28:49