关于echarts环形图某些数据为零不显示，全部数据为零显示灰色的问题

最新推荐文章于 2024-05-13 16:34:04 发布
最新推荐文章于 2024-05-13 16:34:04 发布
阅读量6.9k 收藏 7
点赞数 1
分类专栏： 前端 文章标签： echarts 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/m0_65915285/article/details/127807698
版权

效果图：

 

如图所示，饼图在某些数据为0时，为零的数据不显示，全部数据为零时显示黑框代码如下： 

实现思路如下：1.当其中某一项数据为0时，让他的value为null（实现某些数据为0不显示，但是带来的bug就是当所有数据为0时直接没有圆环了，因此要做第二步）

2.当所有的数据都为null时，向data里push进一个只有value没有name的数据，然后在颜色的数组里面增加一个新的颜色（这个颜色就是数据全为0时的颜色，此时数据为0的会有提示语，本公司没有做要求不要提示语，如果需要不要提示语可以在tooltip里面做判断哦）

这是echart饼图自定义提示语，我做的是数据全为0显示总数为0，你们可以通过show:true来进行判断就好了，嘿嘿嘿 

 

小猫猫改bug
关注
  • 1
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
解决Echarts2竖直datazoom滑动后显示数据不全的问题
10-15
在使用ECharts这一强大的数据可视化库时，可能会遇到各种问题，其中之一便是Echarts2中竖直datazoom滑动后导致数据显示不全的情况。这个问题对于数据展示的完整性和用户体验有着显著的影响，因此解决它是至关重要的...
echarts地图散点悬浮显示多条数据
10-29
echarts地图散点悬浮显示多条数据echarts地图散点悬浮显示多条数据echarts地图散点悬浮显示多条数据
ECharts饼图接口数据为空时如何显示指定颜色
OneILove的博客
12-18 5582
需求：获取饼图需要展示的数据为空时，饼图显示默认数据和指定颜色 let PicChart = this.$echarts.init(document.getElementById(PicChart)) PicChart.setOption({ title: {text:‘标题’,left:'center'}, tooltip: {}, series: [{ ...
echarts饼图，设置值为0时不显示
weixin_42844590的博客
03-16 3606
设置最小扇形区域角度后，值为0的也会显示，若想让值为0的不显示，需要处理数据
echarts灰色底色的百分比饼图
最新发布
橙子yq的代码世界
05-13 190
【代码】echarts灰色底色的百分比饼图。
echarts的半环形图数据都为0时不能显示半环形
weixin_42271384的博客
12-14 695
有几项数据就复制几个总和和itemStyle。当每项数据都为0，总和也是0时就不是半环形。
Echart 环图无数据时置灰
我的博客
01-12 795
当数据都是0时，把series里的data=null或者=[ ]版本echarts: “5.3.3”Echart 环pie置灰。
echarts饼图不显示数据为0的数据
热门推荐
风过留痕
06-20 6万+
echarts饼图不显示数据为0的数据（测试可用，希望对有相关问题的人有所帮助）
echarts 圆环图 中间显示数据 下边显示标题
01-07
echarts 圆环图 中间显示数据 下边显示标题 $(function(){ getqykpnzqdata(qykpnzqjn,qykpnzqqn,wmgdseletj); }) /** * 获得数据并显示echarts图 * idnamejn : 显示今年数据的idname * idnameqn : 显示去年数据...
基于echarts的中国地图省份数据统计显示
12-07
Echarts是由百度开发的一款高效、易用且功能丰富的图表库，广泛应用于网页数据可视化的场景，包括但不限于报表、仪表盘、地图等。 首先，`基于echarts的中国地图省份数据统计显示`的标题表明我们将使用Echarts的...
ECharts省份地图数据合集.zip
06-07
ECharts省份地图数据合集。收录中国各个省份的地图JSON数据。ECharts省份地图数据合集。收录中国各个省份的地图JSON数据。ECharts省份地图数据合集。收录中国各个省份的地图JSON数据。ECharts省份地图数据合集。收录...
饼状图数据为零时候不显示数据
axi19990710的博客
01-19 974
百度了老多没啥能用的，完成需求之后晒到网上来吧，能帮助一个是一个别再着急挠头了 下面展示一些 内联代码片。 <template> <div :class="className" :style="{ height: height, width: width }" /> </template> <script> import echarts from "echarts"; //引入 require("echarts/theme/macarons"); //
echarts data里的value为0时隐藏显示 label为0时隐藏
༺墨༒眉༻
11-08 1万+
版本echarts3 官方文档：http://echarts.baidu.com/tutorial.html#5%20%E5%88%86%E9%92%9F%E4%B8%8A%E6%89%8B%20ECharts 先看一下源代码： &lt;script type="text/javascript"&gt; option = { title : { text: '某站点...
echarts 图表无数据/空数据 展示“暂无数据”
细节怪的博客
08-15 2万+
我们从后端获取数据动态渲染图表时，难免会遇到数据为空的情况（虽然实际应用中这样的bug极少遇到），但考虑周全一点也好，看如何实现吧。
Echarts 堆叠图数据为0的展示
时光足迹
08-26 827
const stackBarSeries = { type: "bar", label: { show: true, // 当数据为0时不显示，不然会出现加粗0标识 formatter: function(params) { if (params.value > 0) { return params.value; } else { return ""; } }, }, }; ```![请添加
echarts 图表无数据为空时显示“暂无数据”
細水、長流√的专栏
12-22 1万+
如标题所述，我们希望 echarts 图表在没有数据时显示 “-暂无相关数据-” 字样。 操作： 需要对返回的数据做判断，如果有数据则正常显示图表，如果没有数据，我们将此 div 的内容改为文本 “-暂无相关数据-”，并设置样式即可。 HTML： <div id="chart"></div> JS（Vue）： 方法（一）： // 无数据时：展示暂无数据 const dom = document.getElementById('chart'); dom.innerHT
echarts饼状图，不显示值为0的数据
态度决定一切
02-22 6155
echart饼图上，有的数据为0，不希望显示出来，该如何实现呢？看下面案例
解决Echarts图表不显示的问题和Echarts展示大量数据时页面卡顿或者无响应的问题
liuhebahuang的博客
05-12 4606
确保已经正确引入Echarts的JS文件，并设置一个具有宽度和高度的DOM元素。
echarts柱状图柱体里面显示数值并且数据为零不显示的属性
06-06
您可以在 ECharts 的柱状图中设置 label.normal.show 属性为 true，并且通过 formatter 属性控制数值的显示格式，如下所示： ``` series: [{ type: 'bar', data: [0, 12, 5, 8, 0, 10], label: { normal: { show: true, formatter: function(params) { return params.value === 0 ? '' : params.value; } } } }] ``` 在这个例子中，数据项为 0 的柱体不会显示数值，而其他柱体会显示对应的数值。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值