echarts多条折线图展示不一样的单位变化

最近接了个需求:
在多个折线图中要每条数据

  1. 一万以下显示(元)
  2. 一万以上显示(万元)
  3. 一亿显示亿元 (亿元)
    echarts多条折线图展示不一样的单位变化_第1张图片

在tooltip中加上formatter即可

tooltip: {
            trigger: 'axis',
            // formatter: '{a0}: {c0}元
{a1}: {c1}元
{a2}: {c2}元'
formatter: function (c) { let one = {}; let two = {}; let three = {}; c.forEach((item,index)=>{ switch (index){ case 0: if (item.value >= 100000000) { one.format = '亿元'; one.value = item.value/100000000 } else if (item.value >= 10000) { one.format = '万元'; one.value = item.value/10000 } else { one.format = '元'; one.value = item.value } one.seriesName = item.seriesName break; case 1: if (item.value >= 100000000) { two.format = '亿元'; two.value = item.value/100000000 } else if (item.value >= 10000) { two.format = '万元'; two.value = item.value/10000 } else { two.format = '元'; two.value = item.value } two.seriesName = item.seriesName break; case 2: if (item.value >= 100000000) { three.format = '亿元'; three.value = item.value/100000000 } else if (item.value >= 10000) { three.format = '万元'; three.value = item.value/10000 } else { three.format = '元'; three.value = item.value } three.seriesName = item.seriesName break; }; }) return one.seriesName+': '+one.value+one.format+'
'
+two.seriesName+': '+two.value+two.format+'
'
+three.seriesName+': '+three.value+three.format }, },

这个代码还是有问题,但是思路是对的,所以在经过优化与合并之后,最终版长这样

tooltip: {
    trigger: 'axis',
    // formatter: '{a0}: {c0}元
{a1}: {c1}元
{a2}: {c2}元'
formatter: function (c) { let str = ''; c.forEach((item)=>{ let temp = {}; if (item.value >= 100000000) { temp.format = '亿元'; temp.value = item.value/100000000 } else if (item.value >= 10000) { temp.format = '万元'; temp.value = item.value/10000 } else { temp.format = '元'; temp.value = item.value } temp.seriesName = item.seriesName str += temp.seriesName+': '+temp.value+temp.format+'
'
}) return str }, }

你可能感兴趣的:(vue+echarts,H5)