echarts 饼图图例形状及位置

echarts 饼图图例形状及位置

 

 

option = {
   title : {
       text: \'图例形状及位置\',
       subtext: \'\',
       x:\'center\'
   },
   tooltip : {
       trigger: \'item\',
       formatter: "{a} <br/>{b} : {c} ({d}%)"
   },
   legend: {
      orient: \'\',
          x: \'left\', //可设定图例在左、右、居中 left  center  right
          y: \'bottom\', //可设定图例在上、下、居中left  center  right
       data: [
           {
               name:\'圆圈\',
               icon : \'circle\',           // 图例形状：圆圈
               textStyle: {
                    color: \'red\'          // 图例文字颜色
               }
           },
           {
               name:\'长方形\',
               icon : \'rect\',              // 图例形状：长方形
               textStyle: {
                    color: \'#fff\'          // 图例文字颜色
               }
           },
           {
               name:\'圆角长方形\',
               icon : \'roundRect\',          // 图例形状：圆角长方形
               textStyle: {
                    color: \'#fff\'          // 图例文字颜色
               }
           },  
           {
               name:\'三角形\',
               icon : \'triangle\',           // 图例形状：三角形
               textStyle: {
                    color: \'blue\'          // 图例文字颜色
               }
           },               
           {
               name:\'菱形\',
               icon : \'diamond\',           // 图例形状：菱形
               textStyle: {
                    color: \'#fff\'          // 图例文字颜色
               }
           },               
           {
               name:\'箭头\',
               icon : \'arrow\',             // 图例形状：箭头
               textStyle: {
                    color: \'#fff\'          // 图例文字颜色
               }
           },             
           {
               name:\'圆形\',
               icon : \'pin\',             // 图例形状：圆形
               textStyle: {
                    color: \'#fff\'          // 图例文字颜色
               }
           },             
           {
               name:\'自定义图片\',            
               textStyle: {
                    color: \'red\'          // 图例文字颜色
               },
               icon:\'image://./img/pie_1.png\'//格式为\'image://+icon文件地址\'，其中image::后的//不能省略
           },       
],            
   },
   series : [
       {
           name: \'访问来源\',
           type: \'pie\',
           radius : \'55%\',
           center: [\'50%\', \'60%\'],
           data:[
               {value:335, name:\'圆圈\'},
               {value:310, name:\'长方形\'},
               {value:234, name:\'圆角长方形\'},
               {value:135, name:\'三角形\'},
               {value:1548, name:\'菱形\'},
               {value:1548, name:\'箭头\'},
               {value:1548, name:\'圆形\'},
               {value:1548, name:\'自定义图片\'}
           ],
           itemStyle: {
               emphasis: {
                   shadowBlur: 10,
                   shadowOffsetX: 0,
                   shadowColor: \'rgba(0, 0, 0, 0.5)\'
               }
           }
       }
   ]
};