前言
由于公司业务需要做一些图标来展示一些数据,之前都是用百度的echart.js。这次放弃使用它转而自己开发是有几个原因
1、echart文件太大,有些功能用不到
2、echart样式不易扩展
3、需求简单
考虑上面几个原因就决定自己开发一个图标库,主要介绍折线图和雷达图
技术研究
绘制图表可以用canvas、svg、webgl等,echart是用canvas绘制,所以我就直接考虑用canvas。
折线图:通过lineto将点连起来
雷达图:由外向内,通过arc、fill等方法绘制
主要问题
1、折线图转成曲线
通过网上查找资料,按照腾讯这篇文章来实现http://www.alloyteam.com/2015/08/zhe-xian-zhuan-qu-xian/
2、图片文字模糊
问题分析和解决这里已经总结