南丁格尔玫瑰图echarts 饼配置项内容和展示

纯属虚构

      option = {
    baseOption: {
        title: {
            text: '南丁格尔玫瑰图',
            subtext: '纯属虚构',
            x: 'center'
        },
        tooltip: {
            trigger: 'item',
            formatter: "{a} <br/>{b} : {c} ({d}%)"
        },
        legend: {
            data: ['rose1', 'rose2', 'rose3', 'rose4', 'rose5', 'rose6', 'rose7', 'rose8']
        },
        toolbox: {
            show: true,
            feature: {
                mark: {
                    show: true
                },
                dataView: {
                    show: true,
                    readOnly: false
                },
                magicType: {
                    show: true,
                    type: ['pie', 'funnel']
                },
                restore: {
                    show: true
                },
                saveAsImage: {
                    show: true
                }
            }
        },
        calculable: true,
        series: [{
            name: '半径模式',
            type: 'pie',
            roseType: 'radius',
            label: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: true
                }
            },
            lableLine: {
                normal: {
                    show: false
                },
                emphasis: {
                    show: true
                }
            },
            data: [{
                value: 10,
                name: 'rose1'
            }, {
                value: 5,
                name: 'rose2'
            }, {
                value: 15,
                name: 'rose3'
            }, {
                value: 25,
                name: 'rose4'
            }, {
                value: 20,
                name: 'rose5'
            }, {
                value: 35,
                name: 'rose6'
            }, {
                value: 30,
                name: 'rose7'
            }, {
                value: 40,
                name: 'rose8'
            }]
        }, {
            name: '面积模式',
            type: 'pie',
            roseType: 'area',
            data: [{
                value: 10,
                name: 'rose1'
            }, {
                value: 5,
                name: 'rose2'
            }, {
                value: 15,
                name: 'rose3'
            }, {
                value: 25,
                name: 'rose4'
            }, {
                value: 20,
                name: 'rose5'
            }, {
                value: 35,
                name: 'rose6'
            }, {
                value: 30,
                name: 'rose7'
            }, {
                value: 40,
                name: 'rose8'
            }]
        }]
    },
    media: [{
        option: {
            legend: {
                right: 'center',
                bottom: 0,
                orient: 'horizontal'
            },
            series: [{
                radius: [20, '50%'],
                center: ['25%', '50%']
            }, {
                radius: [30, '50%'],
                center: ['75%', '50%']
            }]
        }
    }, {
        query: {
            minAspectRatio: 1
        },
        option: {
            legend: {
                right: 'center',
                bottom: 0,
                orient: 'horizontal'
            },
            series: [{
                radius: [20, '50%'],
                center: ['25%', '50%']
            }, {
                radius: [30, '50%'],
                center: ['75%', '50%']
            }]
        }
    }, {
        query: {
            maxAspectRatio: 1
        },
        option: {
            legend: {
                right: 'center',
                bottom: 0,
                orient: 'horizontal'
            },
            series: [{
                radius: [20, '50%'],
                center: ['50%', '30%']
            }, {
                radius: [30, '50%'],
                center: ['50%', '70%']
            }]
        }
    }, {
        query: {
            maxWidth: 500
        },
        option: {
            legend: {
                right: 10,
                top: '15%',
                orient: 'vertical'
            },
            series: [{
                radius: [20, '50%'],
                center: ['50%', '30%']
            }, {
                radius: [30, '50%'],
                center: ['50%', '75%']
            }]
        }
    }]
};