Echart可视化学习（七）
文档的源代码地址，需要的下载就可以了（访问密码：7567）
https://url56.ctfile.com/f/34653256-527823386-04154f
正文：
官网找到类似实例， 适当分析，并且引入到HTML页面中
打开后，查看源码
去掉Title，剩下的引入到们的文件中
回到index.js文件中，编写立即执行函数
实例化对象
将前面的官网示例代码粘贴过来，完成配置指定
把配置给实例对象
查看效果
为了方便显示，删除3条线
删除后
查看效果
根据需求定制图表
需求1： 修改折线图大小，显示边框设置颜色：#012f4a，并且显示刻度标签。
查看效果
需求2： 修改图例组件中的文字颜色 #4c9bfd， 距离右侧 right 为 10%
如果series对象有name值，则legend可以不用写data
查看效果
需求3： x轴相关配置
刻度去除
x轴刻度标签字体颜色：#4c9bfd
剔除x坐标轴线颜色（将来使用Y轴分割线)
轴两端是不需要内间距 boundaryGap
查看效果
需求4： y轴的定制
刻度去除
字体颜色：#4c9bfd
分割线颜色：#012f4a
查看效果
需求5：两条线形图定制
颜色分别：#00f2f1 #ed3f35
通过这个color修改两条线的颜色
把折线修饰为圆滑 series 数据中添加 smooth 为 true
查看效果
需求6： 配置数据
X轴上的数据
图标数据
查看效果
自适应
Echart可视化学习（七）的更多相关文章
- Echart可视化学习集合
一.基本介绍:ECharts是一款基于JavaScript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表.ECharts最初由百度团队开源,并于2018年初捐赠给Apache ...
- Echart可视化学习（五）
文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 常见的数据可视化库: D3.js ...
- Echart可视化学习（一）
文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 创建需要的目录结构及文件 ...
- Echart可视化学习（二）
文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 页面主体部分 设置测试样式 ...
- Echart可视化学习（三）
文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 编写中间模块 添加显示样式 ...
- Echart可视化学习（四）
文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 地图模块高度为 810px ...
- Echart可视化学习（六）
文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 柱状图定制 官网找到类似实例, 适 ...
- Echart可视化学习（八）
文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 正文: 新增需求 点击 2020年 ...
- Echart可视化学习（九）
文档的源代码地址,需要的下载就可以了(访问密码:7567) https://url56.ctfile.com/f/34653256-527823386-04154f 官网找到类似实例, 适当分析,并且 ...
随机推荐
- numpy基础教程--clip函数的使用
在numpy中,clip函数的原型为clip(self, min=None, max=None, out=None),意思是把小于min的数全部置换为min,大于max的数全部置换为max,在[min ...
- MQTT协议 - arduino ESP32 通过精灵一号 MQTT Broker 进行通讯的代码详解
前言 之前研究了一段时间的 COAP 协议结果爱智那边没有测试工具,然后 arduino 也没有找到合适的库,我懒癌发作也懒得修这库,就只能非常尴尬先暂时放一放了.不过我在 爱智APP -> 设 ...
- [BUUCTF]REVERSE——[SUCTF2019]SignIn
[SUCTF2019]SignIn 附件 步骤: 无壳,64位ida载入 程序调用了 __gmpz_init_set_str 函数,这是一个 GNU 高精度算法库,在RSA加密中见过几次,加上6553 ...
- [BUUCTF]PWN——CmmC_Simplerop
cmcc_simplerop 附件 步骤 例行检查,32位,开启了nx保护 本地试运行一下程序,查看一下大概的情况 32位ida载入,习惯性的检索程序里的字符串,看了个寂寞,从main函数开始看程序 ...
- 删除空行（嵌套）（Power Query 之 M 语言）
数据源: "姓名""基数""个人比例""个人缴纳""公司比例""公司缴纳"&qu ...
- M语言的写、改、删（Power Query 之 M 语言）
M语言基本上和其他语言一样,用敲键盘的方式写入.修改.删除,这个是废话. M语言可以在[编辑栏]或[高级编辑器]里直接写入.修改.删除,这个也是废话. M语言还有个地方可以写入.修改.删除,就是[自定 ...
- CF263B Squares 题解
Content 有 \(n\) 个边长为 \(a_i\) 的正方形,第 \(i\) 个正方形的四个顶点分别是 \((0,0),(0,a_i),(a_i,0),(a_i,a_i)\),我们定义一个点属于 ...
- CF1427A Avoiding Zero 题解
Content 请将一个长度为 \(n\) 的数列 \(A\) 重新排序,使得这个数列所有的前缀和 \(\neq 0\),或者证明没有这样的方案. 数据范围:\(t\) 组数据,\(1\leqslan ...
- hashlib加密模块主要提供 SHA1, SHA224, SHA256, SHA384, SHA512 ，MD5 算法，HMAC消息签名(HMAC-SHA1，....)
hashlib模块 用于加密相关的操作,3.x里代替了md5模块和sha模块,主要提供 SHA1, SHA224, SHA256, SHA384, SHA512 ,MD5 算法 MD5 摘要输出 # ...
- 【手把手教程】uniapp + vue 从0搭建仿微信App聊天应用：腾讯云TXIM即时通讯的最佳实践
基于uniapp + vue 实现仿微信App聊天应用实践,实现以下功能 1: 用户登陆 2: 聊天会话管理 3: 文本/图片/视频/定位消息收发 4: 贴图表情消息收发 5: 一对一语音视频在线通话 ...