最近在工作中发现Echarts>label>formatter无法使用<img src="qq244769060">导致无法直接<img src="xxxxxxx">直接引入Img图片,在网络中多次寻找答案无果,无意在Echarts官网中发现解决方法:
使用自定义样式引入图片,话不多说,直接看代码。
label : {
normal : {
color : '#000000',
formatter : function(params) {
var res = '';
var myseries = option.series;
for (var j = 0; j < myseries[0].data.length; j++) {
if (myseries[0].data[j].name == params.name) {
res += ' '+myseries[0].data[j].name
//请注意写法:{xxx|} 'xxx'代表你自定义的name,'|'代表是自定义的一定要加上
+ '\n {img1|}' + myseries[0].data[j].value
+ '\n {img2|}' + myseries[0].data[j].value2
+ '\n {img3|}' + myseries[0].data[j].value3;
}
}
return res;
},
rich : {
//这里设置您的图片引用名称
img1 : {
//引入图片
backgroundColor : {
image : './modules/img/xxx.png'
},
},
img2 : {
backgroundColor : {
image : './modules/img/xxx.png'
},
},
img3 : {
backgroundColor : {
image : './modules/img/xxx.png'
},
},
},
position : 'right',
show : true,
},
},
欢迎转载,请带上博主
原创:Java-MubaiClink