圖表需要展示所有部門的數(shù)據(jù),但是部門很多,不能一一展示,而且當數(shù)據(jù)為0的時候他會占一個位子,但是又需要展示所有的圖例,可以看到后端返回給我們數(shù)據(jù)中有很多含有0的,而設(shè)計著重展示了這是一個南丁格爾玫瑰圖,南丁格爾玫瑰圖只有兩種格式’radius’,’area’。
當選擇radius時他會根據(jù) 扇區(qū)圓心角展現(xiàn)數(shù)據(jù)的百分比,半徑展現(xiàn)數(shù)據(jù)的大小。
而為0的時候,雖然他沒有占據(jù)餅圖的某一塊,但是Echarts卻把文字展示了出來,顯得很難看。
因為0雖然代表這個值沒有,但是0本身也是一個值,所以Echarts把0這個數(shù)據(jù)也展示了出來,下面有兩種方法,一個騷套路,一個高大上一點,請看。
可以看到,后端傳過來的是name和count,但是Echarts不認識count,它只認識value,
所以前端處理一下。
這里我們只處理不等于0的,為0的還是讓他用count這個數(shù)據(jù),因為不認識所以它沒有顯示,但是因為有name,所以圖例顯示了。當然這個方法是錯的,是我偶然間發(fā)現(xiàn)的,但是他有用,俗話說:當你的程序以一種你意想不到的方法跑起來,那就不是bug,那叫特性!
接下來請看正確解法,還是處理數(shù)據(jù),我們這次把count全部換成value,但是如果為0的我們讓它變?yōu)閚ull,這里也成功了。
關(guān)鍵詞: