Highcharts动画系列节目

时间:2013-08-30 07:06:27

标签: highcharts highstock

我想用最初的动画显示/隐藏图表系列,这意味着如果在此

$(function () {
            $('#container').highcharts({

                series: [{
                    data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
                }, {
                    data: [129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4, 29.9, 71.5, 106.4]
                }]
            });


            // the button action
            var chart = $('#container').highcharts(),
                $button = $('#button');
            $button.click(function() {
                var series = chart.series[0];
                if (series.visible) {
                    series.hide();
                    $button.html('Show series');
                } else {
                    series.show();
                    $button.html('Hide series');
                }
            });
        });

http://jsfiddle.net/pbohny/GvkPW/

我点击隐藏/显示,显示系列应该像初始动画一样动画(从左到右构建)。

这可能吗?

1 个答案:

答案 0 :(得分:4)

不支持。您可以通过删除并添加该系列来尝试获得所需的结果,请参阅:http://jsfiddle.net/GvkPW/1/

// the button action
var flag = true;
var chart = $('#container').highcharts(),
    $button = $('#button');
$button.click(function() {
    var series = chart.get('1st');
    if (flag) {
        series.remove();
        $button.html('Show series');
    } else {
        chart.addSeries({
            id: '1st',
            data: [29.9, 71.5, 106.4, 129.2, 144.0, 176.0, 135.6, 148.5, 216.4, 194.1, 95.6, 54.4]
        });
        $button.html('Hide series');
    }
    flag = !flag;
});