echarts饼图指示线文字换行

var get=function(e){//使饼图标签换行显示的函数

          var newStr=" ";

          var start=0;//开始截取位置

          var end=0;//截取结束位置

          var name_len=e.name.length; //每个内容名称的长度

          var max_name=5;//每行显示的最大长度

          var new_row=Math.ceil(name_len/max_name);//显示行数

          if(name_len>max_name){//如果名称长度大于每行最大显示长度,则

              for(var i=0;i<new_row;i++){//循环行数

                var old='';//每次截取的字符

                start=i*max_name;//截取的起点

                end=start+max_name;//截取的终点

                if(i==new_row-1){//如果是最后一行

                  old=e.name.substring(start);

                }else{

                  old=e.name.substring(start,end)+"\n";//截取内容加换行

                }

                newStr+=old;//拼接字符串

              }

          }else{//否则不变显示

              newStr=e.name;

          }

          return newStr;

          }

option = {

    title: {

        text: '某站点用户访问来源',

        subtext: '纯属虚构',

        left: 'center'

    },

    tooltip: {

        trigger: 'item',

        formatter: '{a} <br/>{b} : {c} ({d}%)'

    },

   

    series: [

        {

            name: '访问来源',

            type: 'pie',

            radius: '55%',

            center: ['50%', '60%'],

            data: [

                {value: 100910, name: '参加职工养老保险'},

                {value: 37520, name: '农村种养家'},

                {value: 22503, name: '帮扶基地、助残增收、职康站安置'}

            ],

            label: {

                              normal: {

                                      formatter: get,

                                      fontSize:14,

                                      lineHeight: 18,

                                      }

                     },

                /*labelLine:{

                    length:10,

                    length2:5,

                },*/

            emphasis: {

                itemStyle: {

                    shadowBlur: 10,

                    shadowOffsetX: 0,

                    shadowColor: 'rgba(0, 0, 0, 0.5)'

                }

            }

        }

    ]

};

 

posted @ 2020-04-10 14:06  hjLu  阅读(4053)  评论(0编辑  收藏  举报