博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
echarts饼图不显示数据为0的数据
阅读量:6293 次
发布时间:2019-06-22

本文共 661 字,大约阅读时间需要 2 分钟。

首先阐述下为什么会有这个需求,这个和echarts自身的显示效果有关。

如果你选择的展示图形为饼图,然后你的数据里有一条数据为0,那么展示的数据就为一条直线,看上去效果并不好,

会很突兀。

当然如果你的业务需求就算是直线的话也要展示出来,那么下面的文章你可以略过了,对你画图表并没有什么帮助。

言归正传,我这里会结合代码和图给大家看看效果,首先看看数据为0时的效果。效果如下

附上代码:

        echarts测试                       

是不是很难受。

下面我这里介绍下将0数据不在饼图上显示的几种方式。

现附上最终效果图:

1.在后台数据处理时候讲数据结果为0的数据过滤掉(这个大家根据业务情况做处理,这里只讲述下思路,不做具体展示)

2.在option的定义里处理(和第三个方法本质上是一样的,2的方式对各个数据进行处理,更有针对性,而3对饼图里的所有数据都做统一处理,大家根据需要进行选择)

附上代码:

        echarts测试                       

3.写一个函数,遍历所有的数据,将为0的数据隐藏掉

附上代码:

        echarts测试                       

 

 

转载于:https://www.cnblogs.com/raind/p/9139619.html

你可能感兴趣的文章
数学公式的英语读法
查看>>
留德十年
查看>>
迷人的卡耐基说话术
查看>>
PHP导出table为xls出现乱码解决方法
查看>>
PHP问题 —— 丢失SESSION
查看>>
Java中Object类的equals()和hashCode()方法深入解析
查看>>
数据库
查看>>
dojo.mixin(混合进)、dojo.extend、dojo.declare
查看>>
Python 数据类型
查看>>
iOS--环信集成并修改头像和昵称(需要自己的服务器)
查看>>
PHP版微信权限验证配置,音频文件下载,FFmpeg转码,上传OSS和删除转存服务器本地文件...
查看>>
教程前言 - 回归宣言
查看>>
PHP 7.1是否支持操作符重载?
查看>>
Vue.js 中v-for和v-if一起使用,来判断select中的option为选中项
查看>>
Java中AES加密解密以及签名校验
查看>>
定义内部类 继承 AsyncTask 来实现异步网络请求
查看>>
VC中怎么读取.txt文件
查看>>
如何清理mac系统垃圾
查看>>
企业中最佳虚拟机软件应用程序—Parallels Deskto
查看>>
Nginx配置文件详细说明
查看>>