专业饼状图,趋势图

描述:当前是关于Echarts图表中的 示例。
 
            let color = ['#da0d68', '#da1d23', '#ebb40f'];
data = [
    {
        name: 'xx专项资金',
        value: 4,
        children: [
            {
                name: 'A部门',
                value: 1,
                children: [
                    {
                        name: 'AA预算项目',
                        value: 0.25,
                        children: [
                            {
                                name: '收款方',
                                value: 0.25,
                            },
                        ],
                    },
                    {
                        name: 'AA预算项目',
                        value: 0.25,
                        children: [
                            {
                                name: '某某区县',
                                value: 0.25,
                                children: [
                                    {
                                        name: '某某部门',
                                        value: 0.25,
                                        children: [
                                            {
                                                name: '某某预算项目',
                                                value: 0.25,
                                                children: [
                                                    {
                                                        name: '收款方',
                                                        value: 0.25,
                                                        
                                                    },
                                                ],
                                            },

                                        ],
                                    },
                                ],
                            },

                        ],
                    },
                    {
                        name: 'AA预算项目',
                        value: 0.25,
                        children: [
                            {
                                name: 'AAA预算项目',
                                value: 0.25,
                                children: [
                                    {
                                        name: 'AAA部门',
                                        value: 0.25,
                                        children: [
                                            {
                                                name: '某某预算项目',
                                                value: 0.25,
                                                children: [
                                                    {
                                                        name: '收款方',
                                                        value: 0.25,
                                                    },
                                                ],
                                            },

                                        ],
                                    },
                                ],
                            },

                        ],
                    },
                    {
                        name: 'AA预算项目',
                        value: 0.25,
                        children: [
                            {
                                name: 'AAA预算项目',
                                value: 0.25,
                                children: [
                                    {
                                        name: 'AAA部门',
                                        value: 0.25,
                                        children: [
                                            {
                                                name: '某某预算项目',
                                                value: 0.25,
                                                children: [
                                                    {
                                                        name: '收款方',
                                                        value: 0.125,
                                                    },
                                                    {
                                                        name: '收款方',
                                                        value: 0.125,
                                                    },
                                                ],
                                            },

                                        ],
                                    },
                                ],
                            },

                        ],
                    },
                ],

            },
            {
                name: 'D部门',
                value: 1,
                children: [
                    {
                        name: 'DD预算项目',
                        value: 0.5,
                        children: [
                            {
                                name: '收款方',
                                value: 0.5,
                            },
                        ],
                    },
                    {
                        name: 'DD预算项目',
                        value: 0.5,
                        children: [
                            {
                                name: '收款方',
                                value: 0.25,
                            },
                            {
                                name: '收款方',
                                value: 0.25,
                            },
                        ],
                    },
                ],

            },
            {
                name: 'C部门',
                value: 1,
                children: [
                    {
                        name: 'C预算项目',
                        value: 1,
                        children: [
                            {
                                name: 'C区县',
                                value: 1,
                                children: [
                                    {
                                        name: 'C部门',
                                        value: 1,
                                        children: [
                                            {
                                                name: 'C预算项目',
                                                value: 0.5,
                                                children: [
                                                    {
                                                        name: '收款方',
                                                        value: 0.25,
                                                    },
                                                    {
                                                        name: '收款方',
                                                        value: 0.25,
                                                    },

                                                ],
                                            },
                                            {
                                                name: 'BB预算项目',
                                                value: 0.5,
                                                children: [
                                                    {
                                                        name: '收款方',
                                                        value: 0.5,
                                                    }
                                                ],
                                            },
                                        ],
                                    },
                                ],
                            },
                        ],
                    },
                ],
            },
            {
                name: 'B部门',
                value: 1,
                children: [
                    {
                        name: 'B预算项目',
                        value: 1,
                        children: [
                            {
                                name: 'B区县',
                                value: 1,
                                children: [
                                    {
                                        name: 'B部门',
                                        value: 1,
                                        children: [
                                            {
                                                name: 'B预算项目',
                                                value: 0.5,
                                                children: [
                                                    {
                                                        name: '收款方',
                                                        value: 0.25,
                                                    },
                                                    {
                                                        name: '收款方',
                                                        value: 0.25,
                                                    },

                                                ],
                                            },
                                            {
                                                name: 'BB预算项目',
                                                value: 0.5,
                                                children: [
                                                    {
                                                        name: '收款方',
                                                        value: 0.5,
                                                    }
                                                ],
                                            },
                                        ],
                                    },
                                ],
                            },
                        ],
                    },
                ],
            },
        ],
    },
];
option = {
    tooltip: {
        show: true,
        formatter: (params) => {
            return params.name;
        },
    },
    color: color,
    title: {
        text: '----',
        top: 10,
        left: 0,
        textStyle: {
            fontWeight: 'bold',
            fontSize: 11,
            color: '#14374B',
        },
    },
    legend: {
        //type:'scroll',
        show: true,
        bottom: 10,
        x: 'center',
        // data: ['干部人事']
    },
    series: {
        type: 'sunburst',
        data: data,
        radius: ['20%', '40%'],
        center: ['50%', '50%'],
        sort: undefined,
        emphasis: {
            focus: 'ancestor',
        },
        label: {
            rotate: 'tangential',
            color: '#fff',
            formatter: (params) => {
                if (params.name.length > 4) {
                    return params.name.substring(0, 4) + '...';
                } else {
                    return params.name;
                }
            },
        },
        levels: [
            {},
            {
                r0: '0%',
                r: '20%',
                itemStyle: {
                    color: '#fff',
                },
                label: {
                    color: '#000',
                    fontWeight: 'bold',
                    fontSize: 15,
                    padding: [0, 0, 40, 0],
                },
            },
            {
                r0: '20%',
                r: '36%',
                itemStyle: {
                    color: '#5FC2FF',
                },
            },
            {
                r0: '36%',
                r: '51%',
                itemStyle: {
                    color: '#667ADD',
                },
            },
            {
                r0: '51%',
                r: '67%',
                itemStyle: {
                    // borderWidth: 0,
                    color: '#FFC701',
                },
            },
            {
                r0: '67%',
                r: '83%',
                itemStyle: {
                    // borderWidth: 0,
                    color: '#FF8E06',
                },
            },
            {
                r0: '83%',
                r: '90%',
                itemStyle: {
                    color: '#4475C2',
                },
            },
            {
                r0: '90%',
                r: '100%',
                itemStyle: {
                    color: '#4475C2',
                },
            },
        ],
    },
};