gRaphael饼图:添加动画 [英] gRaphael Pie Chart : Add animation
问题描述
我想显示带有动画的饼图,该动画将使其从小点"增长到全尺寸饼图,例如 Highcharts演示库-馅饼,但我想将其应用于由gRaphael制成的馅饼
这是我的jsfiddle示例... 带有图例的拉斐尔饼图
谢谢,
要获得这种动画,您必须访问这些扇区并对其进行动画处理:)
您可以使用your_pie.each()
pie.each(function(){
//scale each sector to 0
this.sector.scale(0, 0, this.cx, this.cy);
//animate from 0 to default size
this.sector.animate({ transform: 's1 1 ' + this.cx + ' ' + this.cy }, 1000, "bounce");
});
小提琴在这里: http://jsfiddle.net/85VtZ/6/ >
玩得开心;)
I want to display the pie chart with an animation that will make it grow from a "small point" to full size pie chart , something like this growing pie or this Highcharts Demo Gallery - Pie , but I want to apply it to a pie made with gRaphael ,
Here's my jsfiddle example... raphael pie chart with legend
Thanks ahead,
In order to achieve that kind of animation you have to access the sectors and... animate them :)
You can do this using your_pie.each()
pie.each(function(){
//scale each sector to 0
this.sector.scale(0, 0, this.cx, this.cy);
//animate from 0 to default size
this.sector.animate({ transform: 's1 1 ' + this.cx + ' ' + this.cy }, 1000, "bounce");
});
The fiddle is here: http://jsfiddle.net/85VtZ/6/
Have fun ;)
这篇关于gRaphael饼图:添加动画的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!