Echarts 饼图标题文字换行问题

最新推荐文章于 2024-08-09 09:49:16 发布

卡卡goto

最新推荐文章于 2024-08-09 09:49:16 发布

阅读量4.2w

点赞数 1

分类专栏： js前端

本文链接：https://blog.csdn.net/u014779683/article/details/52859863

版权

js前端专栏收录该内容

4 篇文章 0 订阅

订阅专栏

Echarts 饼图标题文字换行问题

var option = {
   title : {
       text: '数据来源',
       x:'center'
   },
   tooltip : {
       trigger: 'item',
       formatter: "{b} : {c} ({d}%)"
   },
   legend: {
       orient: 'vertical',
       left: 'left',
       data: ['文章','论坛','漏洞','微博','知乎']
   },
   formatter:function(val){    return val.split("-").join("\n");},//此语句是让legend 中的文字进行换行</span>
   series : [
       {
           name: '数据来源',
           type: 'pie',
           radius : '55%',
           center: ['50%', '60%'],
           data:[
               {value:100, name:'文章-文章'},
               {value:100, name:'论坛'},
               {value:1000, name:'漏洞'},
               {value:100, name:'微博'},
               {value:100, name:'知乎'}
           ],
           itemStyle: {
           normal:{
             label:{
             show:true,
             formatter:function(val){   //让series 中的文字进行换行
                 return val.name.split("-").join("\n");}
             },
             labelLine:{
             show:true
             }
             },
               emphasis: {
                   shadowBlur: 10,
                   shadowOffsetX: 0,
                   shadowColor: 'rgba(0, 0, 0, 0.5)'
               }
           }
       }
   ],
  
};

以上是案例，把案例放在http://echarts.baidu.com/demo.html#pie-simple上运行一下