echarts图 饼图

1 强制react组件实时刷新
添加一个key 值，触发的时候，改变key值，带动组件更新

2 饼图

 option = {
        title: {
            text: '各行业新经济企业数量',       //标题
            x: 'left',
            textStyle: {
                color: '#FFFFFF',
                fontSize: 16,
                fontWeight: 400
            },
            padding: [20, 20]
        },
     
        legend: {
            textStyle: {
                color: '#fff',
                fontSize: '12'
            },
            orient: 'vertical',  
            itemWidth: 10,
            itemHeight: 10,
            icon: 'circle',                    //标签形状
            selectedMode: false,        //是否可点击标签，是否可选中
            x: '70%',                            
            y: 'middle',
            data: ["智能经济","创意经济", "绿色经济", "共享经济", "数字经济", "流量经济", "其他"]
            align: 'left',
            right: '20%'
        },
        color: ['#FAB250', '#4DA1CD', '#DEE07F', '#4BFDFF', '#5FE79F', '#877DE1', '#FF7849'],
        series: [
            
            {
                name: '访问来源',
                type: 'pie',                         
                top: '20%',
                radius: ['0%', '50%'],                 //饼图大小
                center: ['36%', '50%'],                   //饼图位置 
                labelLine: {
                    length: 30,                        //引线第一段的长度
                    length2: 20                     //引线第二段的长度
                    
                },
                label: {
                    normal: {
                        formatter: ['{b|{b}}', '{c|{c}户}   {c|{d}%}'].join('\n'),     
                        padding: [0, -20],           //文字位置
                        // a（系列名称），b（数据项名称），c（数值）, d（百分比）
                        rich: {                              //formatter里的style样式
                            c: {
                                color: '#fff',
                                lineHeight: 22,
                                align: 'left'
                            },
                            b: {
                                fontSize: 12,
                                lineHeight: 20
                            }
                            
                        }
                    }
                },
                data: [
                         {name: "智能经济", value: 287931}
                        {name: "创意经济", value: 287989}
                       {name: "绿色经济", value: 291908}
                       {name: "共享经济", value: 296712}
                       {name: "数字经济", value: 297845}
                       {name: "流量经济", value: 301232}
                        {name: "其他", value: 0}]
            }
        ]
    };

呈现的效果：

image.png