Echarts饼图更改颜色、显示数据且换行

标签：数据   ica   val   over   进制   bbs   tooltip   att   end   

var option = {
   title : {
       text: ‘数据来源‘,
       x:‘center‘
   },
   tooltip : {
       trigger: ‘item‘,
       formatter: "{a} <br/>{b} : {c} ({d}%)"
   },
   legend: {
       orient: ‘vertical‘,
       left: ‘left‘,
       data: [‘文章‘,‘论坛‘,‘漏洞‘,‘微博‘,‘知乎‘]
   },
   series : [
       {
           name: ‘数据来源‘,
           type: ‘pie‘,
           radius : ‘55%‘,
           center: [‘50%‘, ‘60%‘],
           data:[
               {value:sum_article, name:‘文章‘},
               {value:sum_bbs, name:‘论坛‘},
               {value:sum_vul, name:‘漏洞‘},
               {value:sum_weibo, name:‘微博‘},
               {value:sum_zhihu, name:‘知乎‘}
           ],
           itemStyle: {
           normal:{
             label:{
             show:true,
             formatter: ‘{b} : {c} \n ({d}%)‘
             },
             labelLine:{
             show:true
             }
             },
               emphasis: {
                   shadowBlur: 10,
                   shadowOffsetX: 0,
                   shadowColor: ‘rgba(0, 0, 0, 0.5)‘
               }
           }
       }
   ],
   color: [‘rgb(254,67,101)‘,‘rgb(252,157,154)‘,‘rgb(249,205,173)‘,‘rgb(200,200,169)‘,‘rgb(131,175,155)‘]

};

红色部分的代码是用来在echarts鼠标不hover在扇形上的时候显示数据的，其中/n用来换行。

绿色部分是改变扇形的颜色，每一个rgb对应data里的一项数据，也可以用十六进制表示颜色。

效果图：

Echarts饼图更改颜色、显示数据且换行

标签：数据   ica   val   over   进制   bbs   tooltip   att   end   

原文地址：http://www.cnblogs.com/qqfontofweb/p/7605918.html