ECharts tooltip默认html样式，保留样式只对数据数值格式化

之前遇到过需要对数据进行百分比展示，echarts提供的默认样式还是挺好的所以想保留样式，但是设置了formatter默认样式就没了，所以写了formatter的html字符串模拟还原了一下默认样式，在此记录和分享。

适用场景：对数据进行处理或格式化但想保留默认tooltip样式

示例截图：在tooltip中对数据添加了%

 效果查看：将代码复制到 echarts解析  

option = {tooltip: {show: true,trigger: 'axis',appendTo: 'body',formatter: (params) => {// tooltip标题let titleHtmlStr = `<div style="font-size:14px;color:#666;font-weight:400;line-height:1;">${params[0].name}</div>`;// tooltip详情内容const itemHtmlStrArr = params.map((item) => {return `<div style="display: flex;align-items:center;">${item.marker}<div style="font-size: 14px;color: #666;margin: 0 20px 0 2px;">${item.seriesName}</div><span style="margin-left: auto;text-align: right;font-weight: 900;">${item.value}%</span></div>`;});const contentHtmlStr = `<div style="display: flex;flex-direction: column;margin-top: 10px;">${itemHtmlStrArr.join('')}</div>`;// 最终html字符串const resHtmlStr = titleHtmlStr + contentHtmlStr;return resHtmlStr;}},legend: {},grid: {left: '3%',right: '4%',bottom: '3%',containLabel: true},xAxis: {type: 'category',boundaryGap: false,data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']},yAxis: {type: 'value'},series: [{name: 'Email',type: 'line',smooth: true,data: [12.2, 13.3, 10.1, 13.6, 40.5, 23.6, 21.3]},{name: 'Union Ads',type: 'line',smooth: true,data: [22.1, 18.4, 19.6, 23.5, 29.3, 33.9, 31.2]}]
};