宠物产品消费归类echarts 饼配置项内容和展示

配置项如下
      //颜色:坐标柚,柱1,线1,柱/轴标文字
var colors = ['#6c6c6c', '#44b7d3', '#e42b6d', '#393939'];
var fontFamilys = ['微软雅黑'];
options = [{
    backgroundColor: '#fff',
    title: {
        text: '宠物产品消费归类',
        x: 'center',
        textStyle: {
            fontSize: 14
        }
    },
    series: [{
        type: 'pie',
        radius: [10, 80],
        label: {
            normal: {
                textStyle: {
                    color: '#484848',
                    fontSize: 12
                },
                formatter: function(param) {
                    return param.name + ': \n' + param.value + '%';
                }
            }
        },
        color: ['#44b7d3', '#69b4c6', '#45fb9f', '#7cdcac', '#999795', '#e2503d', '#e06656'],
        data: [{
            value: 22.02,
            name: '医疗'
        }, {
            value: 12.08,
            name: '保健品'

        }, {
            value: 10.04,
            name: '零食'
        }, {
            value: 7.57,
            name: '智能设备'
        }, {
            value: 5.8,
            name: '日用品'
        }, {
            value: 7.33,
            name: '其它服务'
        }, {
            value: 35.16,
            name: '主粮'
        }]

    }]
}, {
    title: {
        text: '用户对智能用户的消费态度',
        x: 'center',
        textStyle: {
            fontSize: 14
        }
    },
    backgroundColor: '#fff',
    xAxis: [{
        type: "category",
        splitLine: {
            show: false
        },
        axisLabel: {
            interval: 0,
            show: true,
            textStyle: {
                fontFamily: fontFamilys[0],
                fontSize: 12
            }
        },
        axisLine: {
            lineStyle: {
                color: colors[0]
            }
        },
        data: ['定位器', '玩具', '项圈', '监测器', '碗', '喂食器', '电子围栏']
    }],
    yAxis: [{
        type: 'category',
        data: ['没买过/\n不感兴趣', '已买过', '没买过/\n但感兴趣'],
        axisLine: {
            lineStyle: {
                color: colors[0]
            }
        },
    }, {
        type: "value",
        splitLine: {
            show: false
        },
        axisTick: {
            show: false
        },
        axisLine: {
            show: false,
        },
        axisLabel: {
            show: false,
        },
    }],
    series: [{
        name: "Y2",
        type: "bar",
        stack: "占比",
        barMaxWidth: 50,
        barGap: "10%",
        yAxisIndex: 1,
        itemStyle: {
            normal: {
                color: '#e06656',
                label: {
                    show: true,
                    textStyle: {
                        color: '#000'
                    },
                    position: "insideTop",
                    formatter: function(p) {
                        return p.value + '%';
                    }
                }
            }
        },
        data: [
            15.5,
            17.4,
            30.9,
            21.4,
            29.3,
            27.6,
            39.8
        ],
    }, {
        name: "Y1",
        type: "bar",
        stack: "占比",
        yAxisIndex: 1,
        itemStyle: {
            normal: {
                color: '#44b7d3',
                label: {
                    show: true,
                    textStyle: {
                        color: '#000'
                    },
                    position: "insideTop",
                    formatter: function(p) {
                        return p.value + '%';
                    }
                }
            }
        },
        data: [
            14.8,
            27.8,
            15.2,
            11.5,
            17.5,
            19.6,
            10.5
        ]
    }, {
        name: "Y0",
        type: "bar",
        stack: "占比",
        yAxisIndex: 1,
        itemStyle: {
            normal: {
                color: '#45fb9f',
                label: {
                    show: true,
                    textStyle: {
                        color: '#000'
                    },
                    position: "insideTop",
                    formatter: function(p) {
                        return p.value + '%';
                    }
                }
            }
        },
        data: [
            69.7,
            54.8,
            53.9,
            67.1,
            53.2,
            52.8,
            49.7
        ]
    }]
}];
    
截图如下