前言

由于公司业务需要做一些图标来展示一些数据，之前都是用百度的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、图片文字模糊
问题分析和解决这里已经总结https://github.com/baixuexiyang/wchart/wiki/canvas%E7%BB%98%E5%88%B6%E5%9B%BE%E7%89%87%E6%96%87%E5%AD%97%E6%A8%A1%E7%B3%8A

代码地址

https://github.com/baixuexiyang/wchart

自己开发图表插件，脱离echart的更多相关文章

  1. python 全栈开发，Day58(bootstrap组件,bootstrap JavaScript 插件,后台模板,图表插件,jQuery插件库,Animate.css,swiper,运行vue项目)

    一.bootstrap组件 无数可复用的组件,包括字体图标.下拉菜单.导航.警告框.弹出框等更多功能. 组件和插件的区别? 插件:一个功能,比如js文件 组件:html css js 组件包含插件 面 ...

  2. JavaWeb图表插件的小研究

    背景 近期的一个项目中,对数据的统计分析有非常大的要求,这就要求有一款非常强大的报表.图表插件.因此,组长给分了任务.让我们各自去研究不同的图表插件.用了一两天的时间,对java这块的图表插件做了一个 ...

  3. 图表插件Highcharts的动态化赋值，实现图表数据的动态化设置显示

    在很早之前就介绍过图表插件Highcharts的使用了,在2014年的随笔<基于MVC4+EasyUI的Web开发框架经验总结(4)--使用图表控件Highcharts>,这里基本上都介绍 ...

  4. CDN公共库、前端开发常用插件一览表(VendorPluginLib)

    =======================================================================================前端CDN公共库===== ...

  5. 教你开发jQuery插件（转）

    教你开发jQuery插件(转) 阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原文: ...

  6. flot - jQuery 图表插件(jquery.flot)使用

    Flot是纯Javascript实现的基于jQuery的图表插件,主要支持线状图和柱状图的绘制(通过插件也可以支持饼状图). 特别注意Flot使用的是UTC时间,最好修改flot.js去掉所有的UTC ...

  7. 自己动手开发jQuery插件

    因为工作需要,所以这几天琢磨了一下关于jQuery插件开发的问题,经过一天鏖战,终于完成自己动手做的第一个jQuery插件,对于俺这种见了css就蛋疼菊紧的人来说,一天时间8小时,保守估计有5个小时在 ...

  8. Notepad++前端开发常用插件介绍 - BorisHuai前端修炼 - 博客频道 - CSDN

    Notepad++前端开发常用插件介绍 - BorisHuai前端修炼 - 博客频道 - CSDN.NET http://blog.csdn.net/borishuai/article/details ...

  9. python开发vim插件

    [python开发vim插件] 按如下方式使用python开发vim插件,注意调用时使用的是exec. 但在函数中嵌入python代码更为简便,如下: python如何传递参数给python: 代码头 ...

随机推荐

  1. IP分类以及特殊IP

     一.IP分类 点分十进制数表示的IPv4 地址分成几类,以适应大型.中型.小型的网络.这些类的不同之处在于用于表示网络的位数与用于表示主机的位数之间的差别.IP地址分成五类,用字母表示:       ...

  2. SwingBench---ORACLE压力测试工具

    SwingBench---ORACLE压力测试工具 ◆描述SwingBench是Oracle UK的一个员工在一个被抛弃的项目的基础上开发的.目前稳定版本2.5,基于JDK.该工具是免费的,可以在作者 ...

  3. Qt 地址薄 (一) 界面设计

    实现一个简单的地址薄,功能包括:地址的添加.浏览.编辑.查找.输出文件等. 1  界面和元素 整个地址薄界面,可视为一个 AddressBook 类.其中的 Name.Address 以及两个编辑栏, ...

  4. Android项目实战（三十一）：异步下载apk文件并安装(非静默安装)

    前言: 实现异步下载apk文件 并 安装.(进度条对话框显示下载进度的展现方式) 涉及技术点: 1.ProgressDialog   进度条对话框  用于显示下载进度 2.AsyncTask     ...

  5. Ant学习总结5（配合Ant视频8,9）

    重点: Ant的属性介绍:  <property name="build.dir" value="build"/>注意:一般对于常量都会定义成为属性 ...

  6. 核心动画(UIView封装动画)

    一.UIView动画(首尾) 1.简单说明 UIKit直接将动画集成到UIView类中,当内部的一些属性发生改变时,UIView将为这些改变提供动画支持 执行动画所需要的工作由UIView类自动完成, ...

  7. 分布式配置管理--百度disconf搭建过程和详细使用

    先说官方文档:http://disconf.readthedocs.io/zh_CN/latest/index.html 不管是否要根据官方文档来搭建disconf,都应该看一下这一份文档.精炼清晰地 ...

  8. 漂亮的代码3：flatten 一个数组

    看到一个题目: flatten([1,2,3]) // => [1,2,3] flatten([[1,2,3],["a","b","c" ...

  9. 学习笔记——Java数字处理类

    1.数字格式化 使用Java.text.DecimalFormat格式化数字,一般使用其中的DecimalFormat类.如: import java.text.DecimalFormat; publ ...

  10. BeautifulSoup简述

    网页解析器 从网页中提取有价值数据的工具 网页解析器种类 正则表达式 (模糊匹配) html.parser (结构化解析) BeautifulSoup第三方插件 (结构化解析,相对比较强大) lxml ...