javascript – ZingChart – 如何在实时Feed中追加值时保持缩放级别

前端之家收集整理的这篇文章主要介绍了javascript – ZingChart – 如何在实时Feed中追加值时保持缩放级别前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我有一个实时的数据从Iot平台获取数据,每次接收到一个值并附加到绘图中,在这种情况下,每15秒,绘图在更新时重置为其初始缩放级别.

有没有办法停止图表缩小或记录缩放级别,以便在更新后重置?

设置实时Feed

  1. "refresh": {
  2. "type": "Feed","transport": "js","url": "Feed()","interval": 15000
  3. },

获取数据并附加到情节:

  1. // Get new Data
  2. window.Feed = function(callback) {
  3. // Issue a get request
  4. $.getJSON('https://www.thingspeak.com/channels//Feed.json?callback=?&offset=0&results=1',function(){})
  5. // Upon a successful get request...
  6. .done(function(data){
  7. var p = []
  8. p[0] = p[0] = getChartDate(data.Feeds[0].created_at);
  9. p[1] = parseFloat(data.Feeds[0].field1);
  10. var newData2 = [p];
  11. // Append values to Graph
  12. $("#myChart").appendSeriesValues({
  13. "values": [newData2]
  14. });
  15. })
  16. }
最佳答案
您需要通过添加以下内容来调整zoom对象

  1. zoom:{
  2. preserveZoom:true
  3. }

preserveZoom将在刷新时在图形上保持zoomLevel.或者,您可以在进纸刷新时进行调整.添加属性resetTimeout:’Number’将确定Feed重置的值数.默认值相当低(80-100).

  1. refresh:{
  2. ....
  3. resetTimeout:1000,// after 1000 nodes the Feed will re-start
  4. }

我不太确定你的JSON是什么样的,但是如果你想保留滚动条,你需要做几件事.您需要在JSON中定义zoomingscrolling

  1. scrollX:{},// makes the scrollbar appear
  2. scaleX:{
  3. zooming:true,// allows for zooming
  4. ...
  5. }

我在ZingChart团队工作.如果您需要更多帮助,请与我们联系.

猜你在找的JavaScript相关文章