Echarts 应用案例

存在两个柱状轴也就是两个bar 另 stack:'nanen',相同;保证两个数据展示不影响;也就是让其中一个数据存在偏移    offset:[10,0],。



var option3 = {
    grid: {
        left: '3%',
        right:'12%',
        top:0,
        bottom:0,
        containLabel: true,
    },
    xAxis: {
        type: 'value',
        show:false ,
        splitLine:{  
           show:false  
          } 
    },
    yAxis: {
        type: 'category',
          axisLabel:{
              textStyle:{
                 fontSize:12
            }
          },
        data: ['浙江省','上海市','山东省','广东省','北京市',]
    },
    series: [
        {
            type: 'bar',
            itemStyle:{
                        normal:{
                            color:'#3398DB'
                        }
                    },
                    stack:'nanen',
             label: {
                normal: {
                    show: true,
                    fontSize:12,
                    color:'#333',
                    position:'inside'
                }
            },
            data:[3, 38, 40892, 41608, 72294,]
              
        },{
            type: 'bar',
            itemStyle:{
                        normal:{
                            color:'#3398DB',
                           
                        }
                    },
                    stack:'nanen',
             label: {
                normal: {
                fontSize:12,
                    show: true,
                    color:'#000',
                    formatter: "{c}%",
                    position: 'right',
                    offset:[10,0],
                   
                }
            },
            data:[10, 20, 30, 40, 50.23,]
              
        },
    ]
};

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值