echarts中一个option配置两个图形(饼图,柱图)

var arr_name = new Array();
            var arr_value = new Array();
            for (var i = 0; i < data.length; i++) {
                arr_name.push(data[i].name);
                arr_value.push(data[i].value);
            }
var option = {
                grid:
                    [{
                        top: '70%',
                        width: '50%',
                        bottom: '80%',
                        left: 10,
                        containLabel: true
                    }],
                title: {
                    text: '用户登录监控',
                    x: 'center'
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {            // 坐标轴指示器,坐标轴触发有效
                        type: 'shadow'        // 默认为直线,可选为:'line' | 'shadow'
                    }
                },
//                    柱图 ==================================
                xAxis: [
                    {
                        type: 'category',
                        data: arr_name,
                        axisTick: {
                            alignWithLabel: true
                        }
                    }
                ],
                yAxis: [
                    {
                        type: 'value',
                    }
                ],
//                     ==================================
                series: [
//                        柱图添加数据
                    {
                        name: '活跃时间(分)',
                        type: 'bar',
                        barWidth: '30%',
                        data: arr_value
                    },
//                        饼图添加数据
                    {
                        name: '活跃时间(分)',
                        type: 'pie',
                        radius: '50%',
                        center: ['70%', '50%'],
                        avoidLabelOverlap: false,
                        tooltip: {
                            trigger: 'item',
                            formatter: '{a} <br/>{b} : {c} ({d}%)'
                        },
                        data: data,
                        itemStyle: {
                            emphasis: {
                                shadowBlur: 10,
                                shadowOffsetX: 0,
                                shadowColor: 'rgba(0, 0, 0, 0.5)'
                            }
                        }
                    }
                ]
            };

猜你喜欢

转载自blog.csdn.net/admin_1027/article/details/85236427