donutECharts Gallery

20:11:45图表已生成
代码
app.title = '环形图';
option = {
    backgroundColor: '#000',
    color: ['#FE0404', '#00DC58', '#FBA200', '#00CEFF'],
    tooltip: {
        show: false
    },
    series: [{
            name: '访问来源',
            type: 'pie',
            radius: ['30%', '45%'],
            avoidLabelOverlap: false,
            label: {
                normal: {
                    formatter: '{b|{b}} {c|{c}} 台',
                    color: '#fff',
                    rich: {
                        b: {
                            color: '#fff'
                        },
                        c: {
                            fontWeight: 'bold'
                        }
                    }
                }
            },
            labelLine: {
                normal: {
                    show: true,
                    lineStyle: {
                        color: '#274862'
                    },
                    length: 45
                }
            },
            data: [{
                    value: 335,
                    name: '危急'
                },
                {
                    value: 310,
                    name: '高危'
                },
                {
                    value: 234,
                    name: '中危'
                },
                {
                    value: 135,
                    name: '低危'
                }
            ],
            z: 5
        },
        {
            type: 'pie',
            radius: '60%',
            data: [{
                value: 430,
                itemStyle: {
                    normal: {
                        color: 'rgba(0,0,0,0)',
                        borderColor: 'rgba(0,0,0,0)'
                    }
                }
            }],
            labelLine: {
                normal: {
                    show: false
                }
            },
            z: 5,
            tooltip: {
                show: false
            },
            hoverAnimation: false,
            label: {
                normal: {
                    position: 'center',
                    formatter: '{c|{c}} {text|台}',
                    color: '#fff',
                    rich: {
                        c: {
                            fontWeight: 'bold',
                            color: '#fff',
                            fontSize: 40
                        },
                        text: {
                            color: '#5B7DA3'
                        }
                    }
                }
            }
        },
        {
            type: 'pie',
            radius: '60%',
            data: [{
                value: 430,
                itemStyle: {
                    normal: {
                        borderWidth: 2,
                        color: 'rgba(0,0,0,0)',
                        borderColor: '#202D3C'
                    }
                }
            }],
            labelLine: {
                normal: {
                    show: false
                }
            },
            z: 1,
            tooltip: {
                show: false
            },
            hoverAnimation: false,
            label: {
                normal: {
                   show: false
                }
            }
        },
        {
            name: 'x',
            type: 'pie',
            radius: ['0', '10%'],
            data: [{
                value: 1,
                itemStyle: {
                    normal: {
                        color: '#243443',
                        shadowBlur: 50,
                        shadowColor: '#202E3B'
                    },
                    emphasis: {
                        color: '#243443',
                        shadowBlur: 50,
                        shadowColor: '#202E3B'
                    }
                }
            }],
            labelLine: {
                normal: {
                    show: false
                }
            },
            z: 2,
            tooltip: {
                show: false
            },
            hoverAnimation: false
        },
        {
            name: 'x',
            type: 'pie',
            radius: ['10%', '20%'],
            data: [{
                value: 1,
                itemStyle: {
                    normal: {
                        color: '#202E3B',
                        shadowBlur: 50,
                        shadowColor: '#1C2834'
                    },
                    emphasis: {
                        color: '#202E3B',
                        shadowBlur: 50,
                        shadowColor: '#1C2834'
                    }
                }
            }],
            labelLine: {
                normal: {
                    show: false
                }
            },
            z: 2,
            tooltip: {
                show: false
            },
            hoverAnimation: false
        },
        {
            name: 'x',
            type: 'pie',
            radius: ['20%', '30%'],
            data: [{
                value: 1,
                itemStyle: {
                    normal: {
                        color: '#1C2834',
                        shadowBlur: 50,
                        shadowColor: '#1b1e25'
                    },
                    emphasis: {
                        color: '#1C2834',
                        shadowBlur: 50,
                        shadowColor: '#1b1e25'
                    }
                }
            }],
            labelLine: {
                normal: {
                    show: false
                }
            },
            z: 2,
            tooltip: {
                show: false
            },
            hoverAnimation: false
        },
        {
            name: 'x',
            type: 'pie',
            radius: ['45%', '55%'],
            data: [{
                value: 1,
                itemStyle: {
                    normal: {
                        color: '#111A27',
                        shadowBlur: 50,
                        shadowColor: '#1b1e25'
                    },
                    emphasis: {
                        color: '#111A27',
                        shadowBlur: 50,
                        shadowColor: '#1b1e25'
                    }
                }
            }],
            labelLine: {
                normal: {
                    show: false
                }
            },
            z: 2,
            tooltip: {
                show: false
            },
            hoverAnimation: false
        },
        {
            name: 'x',
            type: 'pie',
            radius: ['45%', '50%'],
            data: [{
                value: 1,
                itemStyle: {
                    normal: {
                        color: '#111A27',
                        shadowBlur: 50,
                        shadowColor: '#1b1e25'
                    },
                    emphasis: {
                        color: '#111A27',
                        shadowBlur: 50,
                        shadowColor: '#1b1e25'
                    }
                }
            }],
            labelLine: {
                normal: {
                    show: false
                }
            },
            z: 2,
            tooltip: {
                show: false
            },
            hoverAnimation: false
        },
        {
            name: 'x',
            type: 'pie',
            radius: ['50%', '60%'],
            itemStyle: {
                normal: {
                    color: '#0C141C',
                    shadowBlur: 50,
                    shadowColor: '#1b1e25'
                },
                emphasis: {
                    color: '#0C141C',
                    shadowBlur: 50,
                    shadowColor: '#1b1e25'
                }
            },
            data: [{
                value: 1
            }],
            labelLine: {
                normal: {
                    show: false
                }
            },
            z: 2,
            tooltip: {
                show: false
            },
            hoverAnimation: false
        }
    ]
};
作品使用的第三方脚本

数据管理

历史数据 0 条

代码修改记录

信息提示

保存作品
