說說 Vue.js + Echarts 堆疊條形圖，如何不顯示爲 0 的數據

Echarts 堆疊條形圖，能夠一次性顯示不一樣狀態的統計數據。但若是數據中包含 0，那麼就是擠在一塊兒，影響前一個狀態數據的顯示：

咱們能夠爲 series 中每一項的 label.normal 添加相應的 formatter 函數，讓其返回空串，具體代碼以下。

首先在 Vue.js 的 methods 中新增一個轉換函數：

zero_format(){
	return function (params) {
		if (params.value > 0) {
			return params.value;
		} else {
			return '';
		}
	}
}
複製代碼

接着，在 $echarts 的 series 中，爲每個 label.normal.formatter 指定剛纔定義的函數：

...
{
	name: '進行中任務數',
	type: 'bar',
	stack: '總量',
	label: {
		normal: {
			show: true,
			position: 'insideRight',
			formatter: this.zero_format()
		}
	},
	data: this.task_doing_counts
},
...
複製代碼

運行結果：

是否是很簡單呀 O(∩_∩)O哈哈~