Echarts中根据条件遍历数据改变y轴字体颜色
<div style="width: 100%;height: 100%" id="bottomLeft1"></div>
async getList(){
let axisData={}
let titleList=[]
let yzgList=[]
let zgzList=[]
let xFontColor=[]
let mark='01'
await queryProblemGroupBySort(
{
orgNo:this.oneParams.org
}
).then(res => {
res.data.forEach(item=>{
if(mark==item.supvPrj){
item.fontColor='red'
}else{
item.fontColor='black'
}
xFontColor.push(item.fontColor)
titleList.push(item.problemSort)
yzgList.push(item.yzg)
zgzList.push(item.zgz)
})
if(res.data){
axisData= houseFormat2(yzgList,zgzList)
}
})
let bottomLeft1 = this.$echarts.init(document.getElementById("bottomLeft1"))
setTimeout(()=>{
bottomLeft1.resize()
})
let bottomLeftoption1 = {
tooltip: {
show:true,
trigger: 'axis',
axisPointer: {
type: "none",
crossStyle: {
color: "#999"
}
},
},
color:['#2a99ff','#ff815d'],
legend: {
right:10,
data:['已整改','整改中',],
orient:"vertical",
show:true
},
grid: {
containLabel: true
},
xAxis: {
type: 'value',
name: '个',
min: axisData.ymin,
max: axisData.ymax,
interval:axisData.yinterval,
},
yAxis: [
{
type: 'category',
data: titleList,
axisLabel:{
show:true,
textStyle:{
color:function (value,index) {
return xFontColor[index]
}
}
}
}
],
series: [
{
name: '已整改',
type: 'bar',
stack: 'total',
barWidth:30,
emphasis: {
focus: 'series'
},
data: yzgList,
},
{
name: '整改中',
type: 'bar',
stack: 'total',
barWidth:30,
emphasis: {
focus: 'series'
},
data: zgzList,
},
]
};
bottomLeft1.setOption(bottomLeftoption1)
window.addEventListener('resize',()=>{
bottomLeft1.resize()
})