东京热成人网站_XX另类XX伦理XXAV_亚洲精品无码成人AAA片_高清av中文字幕无码_手机看片国产欧美日韩高清_bd美妙第进化型

咨詢(xún)電話:
15628812133
20
2023/07

Eecahrts當(dāng)數(shù)據(jù)為0的時(shí)候不顯示文字但顯示圖例

發(fā)布時(shí)間:2023-07-20 13:13:02
發(fā)布者:錄入作者
瀏覽量:
0

圖表需要展示所有部門(mén)的數(shù)據(jù),但是部門(mén)很多,不能一一展示,而且當(dāng)數(shù)據(jù)為0的時(shí)候他會(huì)占一個(gè)位子,但是又需要展示所有的圖例,可以看到后端返回給我們數(shù)據(jù)中有很多含有0的,而設(shè)計(jì)著重展示了這是一個(gè)南丁格爾玫瑰圖,南丁格爾玫瑰圖只有兩種格式’radius’,’area’。

屏幕截圖(102).png

當(dāng)選擇radius時(shí)他會(huì)根據(jù) 扇區(qū)圓心角展現(xiàn)數(shù)據(jù)的百分比,半徑展現(xiàn)數(shù)據(jù)的大小。

而為0的時(shí)候,雖然他沒(méi)有占據(jù)餅圖的某一塊,但是Echarts卻把文字展示了出來(lái),顯得很難看。

屏幕截圖(103).png

因?yàn)?雖然代表這個(gè)值沒(méi)有,但是0本身也是一個(gè)值,所以Echarts把0這個(gè)數(shù)據(jù)也展示了出來(lái),下面有兩種方法,一個(gè)騷套路,一個(gè)高大上一點(diǎn),請(qǐng)看。

可以看到,后端傳過(guò)來(lái)的是name和count,但是Echarts不認(rèn)識(shí)count,它只認(rèn)識(shí)value,

屏幕截圖11.png

所以前端處理一下。

這里我們只處理不等于0的,為0的還是讓他用count這個(gè)數(shù)據(jù),因?yàn)椴徽J(rèn)識(shí)所以它沒(méi)有顯示,但是因?yàn)橛衝ame,所以圖例顯示了。當(dāng)然這個(gè)方法是錯(cuò)的,是我偶然間發(fā)現(xiàn)的,但是他有用,俗話說(shuō):當(dāng)你的程序以一種你意想不到的方法跑起來(lái),那就不是bug,那叫特性!

屏幕截圖(104).png

屏幕截圖(101).png

接下來(lái)請(qǐng)看正確解法,還是處理數(shù)據(jù),我們這次把count全部換成value,但是如果為0的我們讓它變?yōu)閚ull,這里也成功了。

屏幕截圖(105).png屏幕截圖(106).png

關(guān)鍵詞:
返回列表