![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Echarts
文章平均质量分 87
DoryDM
送你一匹马,任你行天涯
展开
-
【Echarts第四篇】用自定义图标渲染数据
前言:项目中遇到一个需求,将Y轴数据源中的不同字段用对应的自定义图标展示,正好Echarts支持自定义系列图标,实现起来挺方便,所以我又自己做了一个小栗子,总结一下Echarts自定义系列的用法。这是下文例子的成品demo,包含两个系列(series)的Echarts图,其中一个是普通的折线图,另一个则是根据数据自定义的系列。一、Echarts自定义系列介绍Echarts的自定义系列支持自定义系列中的图形元素,核心API如下:series: [{type: custom, //指定系列类.原创 2020-07-09 22:28:20 · 4151 阅读 · 3 评论 -
Echarts【第三篇】框选型dataZoom配置项
dataZoom配置项主要用来对坐标轴的数据区域进行缩放,分为内置型、滑条型以及框选型。框选型区域缩放功能支持用户通过框选坐标轴的区域,来控制数轴的显示范围。(官网实例传送门)本文重点总结框选型区域缩放的常用配置:配置toolbox配置了toolbox.feature.dataZoom后,工具栏就会显示数据区域缩放相关的图标: 分为区域缩放图标、区域缩放还原图标。区域缩放重置图标需要单独引入。 toolbox: { right: '5%', //工具栏离容器右侧的距离(left、to原创 2020-05-12 16:15:38 · 2616 阅读 · 0 评论 -
【Echarts第二篇】自定义柱状图的样式
以使用频率较高的颜色开始走起~!一.自定义颜色如果系列没有设置颜色,则会依次循环从该列表中取颜色作为系列颜色。官方文档给出的默认颜色列表为:[’#c23531’,’#2f4554’, ‘#61a0a8’, ‘#d48265’, ‘#91c7ae’,’#749f83’, ‘#ca8622’, ‘#bda29a’,’#6e7074’, ‘#546570’, ‘#c4ccd3’]但实际上...原创 2020-03-23 23:14:37 · 4871 阅读 · 0 评论 -
Vue中使用Echarts【第一篇】实现简单柱状图
所需工具: Vue + Vue CLI + Echarts第一步,初始化Vue项目&引入Echarts1.使用Vue CLi构建Vue项目,并引入Echarts,引入方式见官网在这里用npm的方式引入:npm install echarts --save第二步,如果上述步骤没出啥意外,就可以在Vue项目中愉快的使用Echarts了;-)现在开始尝试实现官网给出的柱状图示...原创 2019-09-25 11:31:05 · 11122 阅读 · 0 评论