1
(function($){
  $(function () {
    $(document).ready(function() {
      Highcharts.setOptions({
        global: {
          useUTC: false
        }
      });
      var i=0;
      var chart = new Highcharts.Chart({
        chart: {
          type: 'spline',
          renderTo: 'container',
          animation: Highcharts.svg, // don't animate in old IE
          marginRight: 10,
          events: {
            load: function() {
              // set up the updating of the chart each second
              var series = this.series[0];
              setInterval(function() {
                var Name = new Array();
                Name[0] = "Random data";
                Name[1] = "Volvo";
                var length=chart.series.length;
                var flag=0;
                var index=0;
                var x = (new Date()).getTime(), // current time
                y = Math.random();
                for (var k=0;k<Name.length;k++) {
                  for(var j=0;j<chart.series.length;j++) {
                    if(chart.series[j].name==Name[k]) {
                      flag=1;
                      index=j;
                      x = (new Date()).getTime();
                      y = Math.random();
                      break;
                    }
                  }
                  if(flag==1) {
                    chart.series[index].addPoint([x, y], true, true);
                    flag=0;
                  } else {
                    chart.addSeries({name: '' + Name[k] + '', data: [] });
                    chart.series[length].addPoint([x, y+1], true);
                    length=length+1;
                  }
                }
              }, 1000);
            }
          }
        },
        title: {
          text: 'Live random data'
        },
        xAxis: {
          type: 'datetime',
          tickPixelInterval: 150
        },
        yAxis: {
          title: {
            text: 'Value'
          },
          plotLines: [{
            value: 0,
            width: 1,
            color: '#808080'
          }]
        },
        tooltip: {
          formatter: function() {
            return '<b>'+ this.series.name +'</b><br/>'+
              Highcharts.dateFormat('%Y-%m-%d %H:%M:%S', this.x) +'<br/>'+
              Highcharts.numberFormat(this.y, 2);
          }
        },
        legend: {
          enabled: false
        },
        exporting: {
          enabled: false
        },
        series: [{
          name: 'Random data',
          data: (function() {
            // generate an array of random data
            var data = [],
            time = (new Date()).getTime(),
            i;
            for (i = -19; i <= 0; i++) {
              data.push({
                x: time + i * 1000,
                y: Math.random()
              });
            }
            return data;
          })()
        }]
      });
    });
  });
})(jQuery);

我可以在图表中添加系列和添加点,但我在初始化后添加的系列,即“沃尔沃”,并没有在其点之间画线。可能是什么问题?

还有没有其他方法可以在没有 for 循环的情况下比较数组和添加点?因为我有时可以获得数百万个系列,而且我不想遍历数组来检查它是否存在。那么是否有任何有效的方法来查找列表是否已经存在,如果它存在,它的索引是什么?

这是它的小提琴:www.jsfiddle.net/2jYLz/

4

1 回答 1

0

这与您在添加新系列时启用了 addPoint() 移位的事实有关。换句话说,移位删除第一点并在意甲结束时添加新点。因此,当您有一点时,它会导致您的情况。所以你需要禁用shipfing,当series.data的长度达到10个点时,应该启用shifting。

于 2013-07-25T12:09:22.437 回答