echarts饼状图(指示线、提示文字、分区样式)

前几天一个月薪35k的兄弟,给我推了一个人工智能学习网站,看了一段时间挺有意思的。包括语音识别、机器翻译等从基础到实战都有,很详细,分享给大家。大家及时保存,说不定啥时候就没了。

效果
在这里插入图片描述

option={
   tooltip: {
       trigger: 'item',
       formatter: "{a} <br/>{b}: {c} ({d}%)"
   }, 
   series: [{
       name: '',
       type: 'pie',
       radius: ['50%', '70%'], 
       labelLine:{  
            normal:{  
                 length:15,   	// 指示线长度
                 lineStyle: {
                    color: "#595959"  // 指示线颜色
                 }
            },
       },
       label: {
            normal: {
                 textStyle: {
                       color: '#595959',	// 提示文字颜色
                       fontSize: 18		// 提示文字大小
                 } 
           }
       },
       data: [
           // 各分区样式: value值,name模块文字、itemStyle模块样式
           {value: 10, name: '理财产品 10%', itemStyle: { color: '#FFBD1C'}}, 
           {value: 20, name: '普通经纪 20%', itemStyle: { color: '#13C2C2'}}, 
           {value: 30, name: '期权 30%', itemStyle: { color: '#267CFF' } },
           {value: 40, name: '两融 40%', itemStyle: { color: '#FF8C16' } },
       ]
       
   }]           
} 

原创 链接

在这里插入图片描述

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐