echarts中无下划线实现,我采用图片填充文本块背景的方式实现
长空雁叫霜晨月
的博客中得到启发https://www.cnblogs.com/volodya/p/Echarts.html
图片
代码
先将图片转化为base64编码,在将图片设置为文本块背景(使用网站http://tu.chacuo.net/imagetodataurl)
//定义背景图片 var hr = new Image(); hr.src = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAADAQMAAABoE/fBAAAAAXNSR0IB2cksfwAAAAlwSFlzAAALEwAACxMBAJqcGAAAAAZQTFRFAAAAAAAApWe5zwAAAAJ0Uk5TAP9bkSK1AAAADklEQVR4nGNgYGhgYAAAAYYAgX1rxDcAAAAASUVORK5CYII="; // // // rich: { hr: { '100%', height: 3, backgroundColor: { image:hr }//文本块背景图片 } }, formatter: function (params)//文本(hr就是下划线行) { return [`mm`, `{hr|}`, `m`].join(" "); }