技術標籤：前端樣式JS

需求

ECharts中設定部分資料legend預設置灰，資料按名稱主要分為三類，收入資料、同比資料及環比資料，需求要將同比資料預設置灰。查詢ECharts官方文件，發現可以通過設定legend. selector來實現。legend是動態生成的，因此需要一個方法，動態改變legend的selector設定。

程式碼
只寫了legend部分的主要程式碼。

getOption = (legend, xAxis, data)=> {
	let selectedLegent = {};
	for(let i in legend) {
		if(legend[i]
 
.indexOf('收入')==-1&&legend[i].indexOf('環比')==-1) {
			selectedLegent[legend[i]]=false
		}
	}
	return {
		tooltip: {
			trigger: 'item',
		},
		legend: {
			data: legend,
			selected: selectedLegent
		},
		xAxis: {
			type: 'category',
			data: xAxis,
		},
		yAxis: [{
			type: 'value',
			name:
 
 '單位：萬元',
		}],
		series: data
	}
}

或者

let selectedLegent = {};
for(let i in legend) {
	if(legend[i].indexOf('同比')>-1) {
		selectedLegent[legend[i]]=false
	}
}

可實現ECharts圖動態資料中部分資料legend值預設置灰。

參考文章
ECharts文件legend. selector
echart圖無資料時legend置灰