Question

我在SO上发现了类似的问题，但我的问题似乎有所不同。我使用highstock链接的官方演示：http://www.highcharts.com/stock/demo/dynamic-update

这里我修改了一些数据： var newData =（function（）{ var data = []，time =（new Date（））。getTime（），i; for（i = -199; i＆lt; = 0; i + = 1）{ data.push（[ 时间+ i * 1000， Math.round（Math.random（）* 100） ]）; } 返回数据; }（））; $（function（）{

Highcharts.setOptions({
    global: {
        useUTC: false
    }
});
$('#container').highcharts('StockChart', {
    chart: {
        events: {
        }
    },
    rangeSelector: {
        buttons: [{
            count: 1,
            type: 'minute',
            text: '1M'
        }, {
            count: 5,
            type: 'minute',
            text: '5M'
        }, {
            type: 'all',
            text: 'All'
        }],
        inputEnabled: false,
        selected: 0
    },

    title: {
        text: 'Live random data'
    },

    exporting: {
        enabled: false
    },

    series: [{
        name: 'Random data',
        data: (function () {
            // generate an array of random data
            var data = [],
                time = (new Date()).getTime(),
                i;

            for (i = -999; i <= 0; i += 1) {
                data.push([
                    time + i * 1000,
                    Math.round(Math.random() * 100)
                ]);
            }
            return data;
        }())
    }]
});
$('#button').click(function() {
    var chart = $('#container').highcharts();
    chart.series[0].update({name: 'newName'});
    chart.series[0].setData(newData);
});

}）;

单击按钮后，将生成新图表但没有加载动画。我问这个问题是因为我看到非常相似的问题得到了解决，任何人都可以帮助我吗？非常感谢，并且非常着急〜

Answer 1

在您的代码中，您只是将新数据设置为现有图表。

如果要在单击按钮时创建新图表，则必须在按钮单击功能中移动图表创建。

使用PlotOptions添加系列时，您还可以扩展动画：

  plotOptions: {
    series: {
      animation: {
        duration: 2000
      }
    }
  },

示例：

http://jsfiddle.net/xsmvkgse/2/

没有按钮点击的示例：

http://jsfiddle.net/meh2b8rn/

highcharts如何在数据更新后加载动画？

1 个答案: