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

最新推荐文章于 2024-02-21 17:27:32 发布

Polarisone

最新推荐文章于 2024-02-21 17:27:32 发布

阅读量3.8k

点赞数 1

分类专栏： vue+echarts H5 文章标签： html5 vue.js es6

本文链接：https://blog.csdn.net/Polarisone/article/details/106028494

版权

本文介绍如何在Echarts的多条折线图中，根据数据大小显示不同的单位，如万元、亿元等。通过在tooltip的formatter中进行处理，实现动态单位展示。

摘要由CSDN通过智能技术生成

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

一万以下显示（元）
一万以上显示（万元）
一亿显示亿元（亿元）

在tooltip中加上formatter即可

tooltip: {
   
            trigger: 'axis',
            // formatter: '{a0}: {c0}元<br />{a1}: {c1}元<br />{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