人数统计echarts 柱状配置项内容和展示

      var myColor=['#fff600','#316fc0','#41b3ee'];
var datas=[78,59,15]
option = {
        backgroundColor:'#0e2147',
        grid: {
            left: '0',
            top:'0',
            right: '0',
            bottom: '0',
            containLabel: true
        },
        xAxis: [{
            show: false,
        }],
        yAxis: [{
                splitLine:'none',
                axisTick:'none',
                axisLine:'none',
                axisLabel: {
                        verticalAlign:'bottom',
                        align: 'left',
                        padding: [0,0,10,8],
                        textStyle: {
                            color: '#ffffff',
                            fontSize:'16',
                        }
                    },
                data: ['日活人数','月活人数','实时人数']
            }, {
                splitLine:'none',
                axisTick:'none',
                axisLine:'none',
                data: datas,
                axisLabel: {
                        show:true,
                        verticalAlign:'bottom',
                        align: 'right',
                        padding: [0,8,10,0],
                        textStyle: {
                            color:'#fff',
                            fontSize:'16',
                        },
                        formatter:'{y|{value}} {x|人}',
                        rich:{
                            y:{
                                color:'#fffa6f',
                                fontSize:16
                            },
                            x:{
                                fontSize:12
                            }
                        }
                    },
                
                
               
            },{
                splitLine:'none',
                axisTick:'none',
                axisLine:'none',
                data:[]
            }],
        series: [{
            name: '条',
            type: 'bar',
            yAxisIndex: 0,
            data: datas,
            label:{
                
                  normal:{
                    show:false,
                    position:'right',
                    color: function(params) {
                            var num=myColor.length;
                            return myColor[params.dataIndex%num]
                    },
                    fontSize:16,
                    fontFamily:'arial',
                    formatter:'{c}人'
                  }
            },
            barWidth:6,
            itemStyle: {
                normal: {
                    color: function(params) {
                            var num=myColor.length;
                            return myColor[params.dataIndex%num]
                    },
                    barBorderRadius: 5,
                }
            },
            z: 2
        },{
            name: '外框',
            type: 'bar',
            yAxisIndex: 2,
            barGap: '-100%',
            data: [100,100,100],
            barWidth:6,
            itemStyle: {
                normal: {
                    color:'rgba(255,255,255,.1)',
                    barBorderRadius: 5,
                }
            },
            z: 0
        }, 
        {
            name: '外圆',
            type: 'scatter',
            hoverAnimation: false,
            data:datas,
            yAxisIndex: 2,
            symbolSize:9,
            itemStyle: {
                normal: {
                    color:'#fff',
                    opacity: 1,
                }
            },
            z: 2
        }]
    };