Question

我在我的一个应用程序中使用了图表。基本上基于内容，我想突出显示该特定笔画。目前我可以实现，但是我的要求是让它闪烁/闪烁，好像在特定点上有什么问题。有人可以帮助我，如何实现这一目标？

<path
fill="rgba(214,45,32,0.5)"
d="M 472 125.83319815668202 A 30 30 0 1 1 471.99998500000123 125.803198161682 Z" 
stroke="#d62d20"
stroke-width="2"
class="highcharts-point highcharts-negative highcharts-color-1 highcharts-point-hover"
>

</path>

Answer 1

您可以使用Highcharts animate方法来获得所需的结果：

Highcharts.chart('container', {
    chart: {
        events: {
            load: function() {
                var point = this.series[0].points[2];

                function toRed() {
                    point.graphic.animate({
                        fill: '#ff0000'
                    }, {
                        duration: 300
                    }, toBlue);
                }

                function toBlue() {
                    point.graphic.animate({
                        fill: 'rgb(124, 181, 236)'
                    }, {
                        duration: 300
                    }, toRed);
                }

                toRed();
            }
        }
    },
    series: [{
        type: 'column',
        data: [43934, 52503, 57177, 69658, 97031, 119931, 137133, 154175]
    }]
});

实时演示：http://jsfiddle.net/BlackLabel/bxa64930/

API参考：https://api.highcharts.com/class-reference/Highcharts.SVGElement#animate

如何使高图路径填充连续闪烁/闪烁

1 个答案: