自己开发图表插件,脱离echart
前言
由于公司业务需要做一些图标来展示一些数据,之前都是用百度的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的更多相关文章
- python 全栈开发,Day58(bootstrap组件,bootstrap JavaScript 插件,后台模板,图表插件,jQuery插件库,Animate.css,swiper,运行vue项目)
一.bootstrap组件 无数可复用的组件,包括字体图标.下拉菜单.导航.警告框.弹出框等更多功能. 组件和插件的区别? 插件:一个功能,比如js文件 组件:html css js 组件包含插件 面 ...
- JavaWeb图表插件的小研究
背景 近期的一个项目中,对数据的统计分析有非常大的要求,这就要求有一款非常强大的报表.图表插件.因此,组长给分了任务.让我们各自去研究不同的图表插件.用了一两天的时间,对java这块的图表插件做了一个 ...
- 图表插件Highcharts的动态化赋值,实现图表数据的动态化设置显示
在很早之前就介绍过图表插件Highcharts的使用了,在2014年的随笔<基于MVC4+EasyUI的Web开发框架经验总结(4)--使用图表控件Highcharts>,这里基本上都介绍 ...
- CDN公共库、前端开发常用插件一览表(VendorPluginLib)
=======================================================================================前端CDN公共库===== ...
- 教你开发jQuery插件(转)
教你开发jQuery插件(转) 阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原文: ...
- flot - jQuery 图表插件(jquery.flot)使用
Flot是纯Javascript实现的基于jQuery的图表插件,主要支持线状图和柱状图的绘制(通过插件也可以支持饼状图). 特别注意Flot使用的是UTC时间,最好修改flot.js去掉所有的UTC ...
- 自己动手开发jQuery插件
因为工作需要,所以这几天琢磨了一下关于jQuery插件开发的问题,经过一天鏖战,终于完成自己动手做的第一个jQuery插件,对于俺这种见了css就蛋疼菊紧的人来说,一天时间8小时,保守估计有5个小时在 ...
- Notepad++前端开发常用插件介绍 - BorisHuai前端修炼 - 博客频道 - CSDN
Notepad++前端开发常用插件介绍 - BorisHuai前端修炼 - 博客频道 - CSDN.NET http://blog.csdn.net/borishuai/article/details ...
- python开发vim插件
[python开发vim插件] 按如下方式使用python开发vim插件,注意调用时使用的是exec. 但在函数中嵌入python代码更为简便,如下: python如何传递参数给python: 代码头 ...
随机推荐
- Java Web(二) Servlet中response、request乱码问题解决
三月不减肥,五月徒伤悲,这就是我现在的状态,哈哈~ 健身.博客坚持. --WH 一.request请求参数出现的乱码问题 get请求: get请求的参数是在url后面提交过来的,也就是在请求行中, M ...
- 前端开发面试题总结之——HTML
______________________________________________________________________________________________ 相关知识点 ...
- (C#:Socket)简单的服务端与客户端通信。
要求:1.可以完成一对一的通信:2.实现服务端对客户端一对多的选择发送:3.可以实现服务端的群发功能:4.可以实现客户端文件的发送: 要点:服务器端:第一步:用指定的端口号和服务器的ip建立一个End ...
- 读书笔记 effective c++ Item 16 成对使用new和delete时要用相同的形式
1. 一个错误释放内存的例子 下面的场景会有什么错? std::]; ... delete stringArray 一切看上去都是有序的.new匹配了一个delete.但有一些地方确实是错了.程序的行 ...
- 如何在 Windows上编译Objective-C
Objective-C现在几乎已经变成了苹果的专利了,可以直接在苹果的Xcode上编译Objective-C程序,但是在Windows平台下的编译工具就寥寥无几了,本身这种语言用的人就不是很多.今天在 ...
- block循环饮用解决
在block中使用self会引起循环引用导致无法释放. 解决: __weak typeof(self) weakSelf = self; 例如: NSLog(@"init--> val ...
- linux c++ 加载动态库常用的三种方法
链接库时的搜索路径顺序:LD_LIBRARY_PATH --> /etc/ld.so.conf --> /lib,/usr/lib 方法1. vi .bash_profile 设置环 ...
- 学习笔记——Java数组
1.创建一维数组 最简单快捷的方法是:声明的同时为数组分配内存.如: int month[]=new int[12] 也可以先声明再分配内存.如: int month[]; //或int[] mont ...
- ABP Zero 单部署,单数据库,多租户架构
首先,我们应该定义多租户系统中的两个条目: 租主(Host):租主是单例的(只有一个租主).租主会对创建和管理租户负责.因此,一个“租主用户”比所有的租户等级更高,并独立于所有租户,同时还能控制他们. ...
- 关于c# 基础运算符的应用
运算符 分为5种 1 算数预算符 +,-,*,/,分别为加减乘除 ++为加1,--为减1, 前++ 后++ 的区别 int a = 10, b = a++; Console ...