最好要给图片设置height,width,不然会出现首次加载图片位置不对的错误
最好要给图片设置height,width,不然会出现首次加载图片位置不对的错误
最好要给图片设置height,width,不然会出现首次加载图片位置不对的错误
引入需要用的图片(目前这种引入比较好用)
import xzImg from '../../../../../../public/img/analysis/xz1.png'
import cgImg from '../../../../../../public/img/analysis/cg1.png'
import qtImg from '../../../../../../public/img/analysis//qt1.png'
import syImg from '../../../../../../public/img/analysis/sy1.png'
如果想要x轴显示数值,y轴显示图片为坐标,xAxis和yAxis的type代表如何显示
xAxis: { type: 'value', },
yAxis: {
type: 'category',
data: data,
axisLabel: {
inverse: true,
formatter: function (value) {
return '{' + value + '| }';
},
rich: {
xz: {
height: 40,
width:90,
align: 'center',
backgroundColor: {
image: xzImg
}
},
cg: {
height: 40,
width:90,
align: 'center',
backgroundColor: {
image: cgImg
}
},
sy: {
height: 40,
width:90,
align: 'center',
backgroundColor: {
image: syImg
}
},
qt: {
height: 40,
width:90,
align: 'center',
backgroundColor: {
image: qtImg
}
}
}
}
},
rich定义目前只支持英文,如果坐标要显示汉字,formatter中的value要进行特殊处理,例如:formatter: function (value) {
if(value==='行政'){
value='xz'
}
return '{' + value + '| }';
},
‘xz’为rich中定义的图片。