文档的源代码地址,需要的下载就可以了(访问密码:7567)
https://url56.ctfile.com/f/34653256-527823386-04154f

官网找到类似实例, 适当分析,并且引入到HTML页面中

代码也简单改一下

效果如下

在index.html中添加容器

在index.js中,完成立即执行函数

实例化对象

指定配置,将准备好的代码粘贴过来

把配置给实例对象

让图表跟随屏幕自动的去适应

查看效果

根据需求定制图表

定制图表需求1:

修改图例组件在底部并且居中显示。

每个小图标的宽度和高度修改为 10px

文字大小为12 颜色 rgba(255,255,255,.5)

查看效果

定制需求2:

修改水平居中 垂直居中

修改内圆半径和外圆半径为 ["40%", "60%"]

带有直角坐标系的比如折线图柱状图是 grid修改图形大小,而我们饼形图是通过 radius 修改大小

查看效果

定制需求3:更换数据

legend 中的data可省略(前面已经删除)

series 中的数据

修改下颜色

查看效果

Echart可视化学习(十)的更多相关文章

  1. Echart可视化学习集合

    一.基本介绍:ECharts是一款基于JavaScript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.ECharts最初由百度团队开源,并于2018年初捐赠给Apache ...

  2. 终-Echart可视化学习(十二)

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 进入官网寻找 里面可以搜素很多 这 ...

  3. Echart可视化学习(五)

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 常见的数据可视化库: D3.js ...

  4. Echart可视化学习(一)

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 创建需要的目录结构及文件 ...

  5. Echart可视化学习(二)

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 页面主体部分 设置测试样式 ...

  6. Echart可视化学习(三)

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 编写中间模块 添加显示样式 ...

  7. Echart可视化学习(四)

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 地图模块高度为 810px ...

  8. Echart可视化学习(六)

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 柱状图定制 官网找到类似实例, 适 ...

  9. Echart可视化学习(七)

    文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 官网找到类似实例, 适当分 ...

随机推荐

  1. Quartz使用AutoFac依赖注入问题小结

    theme: channing-cyan highlight: a11y-dark 背景 最近在做一个需求,就是在Job中捕捉异常,然后通过邮件或者消息的方式推送给指定人员,在需求实现的过程中遇到的一 ...

  2. Service Worker的应用

    Service Worker的应用 Service worker本质上充当Web应用程序.浏览器与网络(可用时)之间的代理服务器,这个API旨在创建有效的离线体验,它会拦截网络请求并根据网络是否可用来 ...

  3. Git远程操作(附重要原理图)

    原文出处: 阮一峰 Git是目前最流行的版本管理系统,学会Git几乎成了开发者的必备技能. Git有很多优势,其中之一就是远程操作非常简便.本文详细介绍5个Git命令,它们的概念和用法,理解了这些内容 ...

  4. CF938B Run For Your Prize 题解

    Content 有两个人,一个在 \(1\) 处,一个在 \(10^6\) 处,在他们之间有 \(n\) 个奖品,第 \(i\) 个奖品在 \(a_i\) 处.一开始在 \(1\) 处的人每秒可向右移 ...

  5. 手动上下eureka上面服务

    手动下eureka curl -X PUT http://eureka.xxx.xxx.com/eureka/apps/VIDEO-API/111.111.111.111:test-api:0000/ ...

  6. java 数据类型String 【正则表达式】匹配工具 Pattern和Matcher

    Pattern和Matcher的介绍: Pattern对象是正则表达式编译后在内存中的表示形式,因此正则表达式宇符串必须先被编译为Pattern对象,然后再用该Pattern对象创建对应的Matche ...

  7. java面向对象类的继承~ 匿名类 ;多态特性;强制类型转换

    类的继承 创建子类语法:     修饰符 class 子类名 extends 父类名{        } 匿名子类语法: 直接实例化,过程中通过匿名类 继承父类,在实例化过程中将子类匿名 <父类 ...

  8. 【PS算法理论探讨二】 Photoshop中图层样式之 投影样式 算法原理初探讨。

    接下来几篇文章我们将稍微简单的探索下PS中多种图层混合模式的算法内部原理,因为毕竟没有这方面的官方资料,所以很多方面也只是本人自己的探索和实践,有可能和实际的情况有着较大的差异. 在PS的实践中,图层 ...

  9. centos7使用Dockerfile(docker-compose)运行jar包

    Dockerfile文件 FROM openjdk:8-jdk-alpine MAINTAINER "镜像维护者的姓名和邮箱地址" WORKDIR app ADD demo.jar ...

  10. 【LeetCode】841. Keys and Rooms 解题报告(Python & C++)

    作者: 负雪明烛 id: fuxuemingzhu 个人博客: http://fuxuemingzhu.cn/ 目录 题目描述 题目大意 解题方法 DFS BFS 日期 题目地址:https://le ...