Echarts除了tooltip其它的标签暂时都不支持html情况下label标签加背景图片的美化方案_html

tooltip组件html的用法

tooltip: {
show: true,
backgroundColor: "transparent",
formatter: function (params) {
var htmlStr = '';
htmlStr += '<div class="bgboder">';
htmlStr += '<div id="city">所属城市:' + + '</div><div id="trans">交易数量:' + params.data.value + ' 万元</div>';
htmlStr += '</div>';
return htmlStr;
}
},

label组件的用法

label: {
show: true,
formatter: function (params) {
//console.log(params);
let arr = ["所属城市:" + , "交易数量" + params.data.value];
return arr.join("\n");
},
backgroundColor: {
image: 'images/bgboder.png',
},
padding: [30, 0, -20, 0],//内边距属性
width: 150,//宽属性
height: 80,//高属性
color: "#fff",
lineHeight: 20,
rich: {}//控制背景高/宽属性;
},

Done!