0

我正在尝试使用 addPoint() 将数据动态添加到带有日期时间 X 轴的柱形图中。

当我这样做时，在许多情况下，列开始相互重叠。从视觉上看，列宽似乎没有正确更新。

这是一个演示问题的jsfiddle：

http://jsfiddle.net/AkKqP/6/

下面是对应的代码：

var d_t[ 10, 8, 13 ];
var cur=0;
$(function () {
  $('#container').highcharts({
      chart: {
          type: "column"
      },
      series: [{
          data: [ ]
      }],
      xAxis: {
          type: "datetime"
      }
  });
  // the button action
  $('#button').click(function() {
      var chart = $('#container').highcharts();
      var msec = Date.UTC( 2013, 3, d_t[cur] );
      chart.series[0].addPoint( [msec, 10] );
      cur++;
      cur = ( cur >= 4 ) ? 3 : cur;
  });
});

我已经硬编码了四个导致问题出现的日期。

如果您单击添加点按钮 4 次，您将看到添加的数据和第二次添加时奇怪的列宽（它们看起来太窄）的奇怪行为，以及第三次和第四次添加时的重叠列。

一种解决方法似乎是按排序顺序将日期提供给图表。然后，图表正确绘制。或者也许这是必需的？

我可能遗漏了一些明显的东西，但我四处寻找并摆弄了一下，但无法弄清楚。任何建议将不胜感激。

4

1 回答 1

0

在 Highcharts 中，数据xAxis应该按升序排序。看看：http: //jsfiddle.net/AkKqP/8/

于 2013-04-24T10:16:56.087 回答