canvas基础之 konva框架简单应用 饼状图动画













整体思路

定义一些常量,数据 ,扇形半径,圆的半径, 舞台的搭建

创建一个画扇形的构造函数,该构造函数通过传入数据根并且据数据来进行画扇形和具体数据

在该构造函数可以定义三个组用来保存不同东西,扇形一个组  数字文字描述一个组  矩形区域也一个组 

在该构造函数定义个绘制的函数 通过传入画布把里面定义的组放入画布中  

通过扇形组进行遍历 定义一个变量来记录动画的所代表具体扇形,利用递归的方法让每一个扇形都由0到指定的角度

当最后一个扇形结束动画的时候结束递归就可以了 

关键点

扇形的绘制 确定一个起点, 根据起来画扇形  每画一个扇形更新起点  

文字的绘制 通过三角函数来确定位置 进行微调文字达到效果

通过一个变量来记录动画队列,注意结束递归.

最后编辑于 ：
©著作权归作者所有,转载或内容合作请联系作者
平台声明：文章内容（如有图片或视频亦包括在内）由作者上传并发布，文章内容仅代表作者本人观点，简书系信息发布平台，仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android - 收藏集
    Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,764评论 25赞 709
  • 优秀第三方
    发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 14,237评论 4赞 61
  • 无罪之有
    某个朦胧的影子漂浮 在黄昏前栖的薄雾之中 夜幕降落下来 被抛弃的黑色羽毛 远远地 幽暗不明 好比那炽烈 燃起自己痛...
    小窗最亮的星星阅读 3,304评论 2赞 5
  • 微信朋友圈操作男性产品，单月单号贡献1.5-2万利润
    网赚这行，男性粉丝一直是很多人的第一选择，因为引流容易、变现粗暴，而且赚钱也很简单。当然还是有很多学子并不能从中赚...
    小谈创业阅读 5,435评论 0赞 1
  • 2017-10-16
    从前我没把时间太当时间 直到一切都划上句点 清晰的从前就在眼前 可我却再不能用心来体验 莫名的语言在脑海盘旋 场景...
    夜灯下的影总有份孤寂阅读 1,280评论 0赞 1