Echarts 饼图自定义标签

最新推荐文章于 2024-09-06 14:01:58 发布

神农尺

最新推荐文章于 2024-09-06 14:01:58 发布

阅读量1.7k

点赞数 1

分类专栏： echarts 文章标签： echarts javascript 前端

本文链接：https://blog.csdn.net/qq_42855675/article/details/122480067

版权

echarts 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

在这里插入图片描述


      labelLine: {
        show: true,
        length:25,
        length2: 0,
      },
      label:{
        formatter:params=> {
          if(params.data.name == "Email"){
            return "{num|"+ params.data.value +"个}{pre|"+ params.data.pre +"%}\n{hr1|}\n{labelText|"+ params.data.name +"}"
          }else{
           return "{num|"+ params.data.value +"个}{pre|"+ params.data.pre +"%}\n{hr2|}\n{labelText|"+ params.data.name +"}"
          }
        },
        padding:[0,-5,0,-5],
        rich:{
          num:{  
            lineHeight:30,
            padding:[0,30,0,10],
            borderWidth:0
          },
          hr1:{
            borderColor:'#f00',
            width:'100%',
            borderWidth:0.5,
            height:0,
            padding:[0,0,0,0],
          },
          hr2:{
            borderColor:'#00f',
            width:'100%',
            borderWidth:0.5,
            height:0,
            padding:[0,0,0,0],
          },
          labelText:{
            width:'100%',
            lineHeight:30,
            align:'right',
            borderWidth:0
          },
        }
      },
      data: [
        { value: 1048,pre:"10", name: 'Search Engine'},
        { value: 735,pre:"30", name: 'Direct'},
        { value: 580,pre:"10", name: 'Email'},
        { value: 484,pre:"10", name: 'Union Ads'},
        { value: 300,pre:"10", name: 'Video Ads'}
      ],