Highcharts - 柱形图重绘动画

Question

我正在尝试使用新数据阵列更新现有数据系列,并redraw在完成后调用该函数.虽然这很完美,但我不太满意,因为我想进行一种增长/收缩过渡.我看过Highcharts的一个例子(摆弄现有的数据集,然后点击"将新数据设置为选定的系列"按钮),但我无法复制这种行为.

这就是我写的代码:

  var series, newSeriesThreshold = this.chart.series.length * 2;

  for (var i = 0; i < data.length; i += 2) {
    series = {
      name:  this.data[i].title,
      data:  this.data[i].data,
      color: this.data[i].color
    };

    if (i >= newSeriesThreshold) {
      this.chart.addSeries(series, false);
    } else {
      var currentSeries = this.chart.series[i / 2];
      currentSeries.setData(series.data, false);
    }
  }

  this.chart.redraw();

这些是创建图表时的选项:

  var config = {
    chart: {
      renderTo: $(this.container).attr('id'),
      type: this.settings.type,
      animation: {
        duration: 500,
        easing: 'swing'
      }
    },
    title: {
      text: null
    },
    legend: {
      enabled: this.settings.legend.show
    },
    tooltip: {
      formatter: function() {
        return this.x.toFixed(0) + ": <b>" + this.y.toString().toCurrency(0) + '</b>';
      }
    },
    xAxis: {
      title: {
        text: this.settings.xaxis.title,
        style: {
          color: '#666'
        }
      }
    },
    yAxis: {
      title: {
        text: this.settings.yaxis.title,
        style: {
          color: '#666'
        }
      }
    },
    series: series,
    plotOptions: {
      column: {
        color: '#FF7400'
      }
    },
    credits: {
      enabled: false
    }
  };

这样可以立即更新而不会转换效果.我有什么想法可能做错了吗？

Answer 1

这仍然是一个谜。我设法进行轴更新，这表明正在进行某种动画，但它仅应用于轴，而不应用于列。

最终我还是接受了这种行为。