ECharts图表模板
该专栏包含ECharts图表插件中各种图表de使用示例,具体有柱状图、饼图、折线图、条形图、环形图、仪表盘图、关系图、雷达图、漏斗图、2D地图、3D地图等......
GRAY_KEY
这个作者很懒,什么都没留下…
展开
-
ECharts仪表盘(详细示例——附有具体注释)
单仪表盘图表效果如下:具体代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>单仪表盘案例</title> <!-- 引入 ECharts 文件 --> <script s原创 2018-09-09 01:49:37 · 42192 阅读 · 5 评论 -
百度图说——零编程玩转ECharts图表
百度图说 和 ECharts 都是百度ECharts团队研发的产品,在不懂编程或是为了快速完成图表制作的情况下,都可以通过百度图说这一工具实现零编程快速制作图表。百度图说最大的优点:零编程,所见即所得。网址:http://tushuo.baidu.com/使用流程:1.打开 百度图说 网址,可创建账号登录,点击 开始制作图表2.点击 创建图表3.根据需要选择相应的图...原创 2018-08-30 19:34:00 · 7043 阅读 · 0 评论 -
ECharts2D地图(详细示例——附有具体注释)
2D地图图表效果如下:具体代码如下:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>2D地图示例</title> <script type="text/javascript" src=&原创 2018-08-21 23:26:01 · 2921 阅读 · 0 评论 -
ECharts3D地图(详细示例——附有具体注释)
3D地图图表效果如下:具体代码如下:<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>铜仁市3D地图(点击地图区域跳转到相应页面)</title> <script type="text/javasc原创 2018-07-31 19:08:36 · 43382 阅读 · 39 评论 -
ECharts雷达图(详细示例——附有具体注释)
雷达图图表效果如下:具体代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>雷达图案例</title> <!-- 引入 ECharts 文件 --> <script src="原创 2018-06-05 01:08:48 · 43194 阅读 · 3 评论 -
ECharts圆环图(详细示例——满满的注释)
图表效果如下:具体代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>圆环图案例</title> <!-- 引入 ECharts 文件 --> <script src="js/原创 2018-06-03 19:12:15 · 27129 阅读 · 7 评论 -
ECharts环形饼图示例(附有注释)
图表效果如下:具体代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>关系图案例</title> <!-- 引入 ECharts 文件 --> <script src="js/原创 2018-06-02 00:36:07 · 9076 阅读 · 4 评论 -
ECharts关系图(详细示例——满满的注释)
图表效果如下:具体代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>关系图案例</title> <!-- 引入 ECharts 文件 --> <script src="js/原创 2018-06-01 01:49:37 · 46272 阅读 · 24 评论 -
双向条形图案例(附有详细注释)
双向条形图图表效果如下:具体代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>双向条形图案例</title> <!-- 引入 ECharts 文件 --> <script src=&q原创 2018-05-31 01:18:21 · 3939 阅读 · 0 评论 -
三系列柱状图案例
三系列柱状图图表效果如下:具体代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>三系列柱状图案例</title> <!-- 引入 ECharts 文件 --> <script src=原创 2018-05-30 00:32:23 · 1109 阅读 · 0 评论 -
单系列柱状图案例
单系列柱状图图表效果如下:代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>单系列柱状图案例</title> <!-- 引入 ECharts 文件 --> <script src=&q原创 2018-05-29 01:47:36 · 877 阅读 · 0 评论 -
ECharts的geojson地图数据下载(根据城市区划代码的前六位查询)
链接:http://echarts.baidu.com/echarts2/doc/example/geoJson/china-main-city/522200.json想要对应城市的geojson地图数据文件,直接用对应城市的行政编码替换掉链接后面的行政编码即可。(友情提示:貌似不是所有的城市都可以)通过链接打开页面后,将页面另存为即可得到你想要的城市的geojson地图数据文件。如图:...原创 2018-06-14 16:31:57 · 27604 阅读 · 10 评论 -
ECharts折线图(详细案例)
该折线图有几个特性:有数据平均线、有占位背景、X(Y)轴轴线以及轴线刻度不显示。图表效果如下:代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>折线图案例</title> <!-- 引入 ECharts 文件 --&原创 2018-04-25 12:07:06 · 8788 阅读 · 1 评论 -
ECharts漏斗图(详细示例——满满的注释)
图表效果如下:代码如下:<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>(金字塔)漏斗图案例</title> <!-- 引入 ECharts 文件 --> <script src="原创 2018-04-29 23:24:58 · 27771 阅读 · 2 评论