echarts横向左右对比柱状图，两种展示方式（对向、反向）

1、反向

option代码如下：

option = {
                toolbox: {
                    feature: {
                    saveAsImage: { show: true }
                    }
                },
                tooltip: {
                    trigger: 'axis',
                    axisPointer: {
                    type: 'shadow'
                    }
                },
                legend: {
                    left: 'center',
                    // top: '6%',
                    itemWidth: 20,
                    itemHeight: 10,
                    itemGap: 20,
                    textStyle: {
                        padding: [3,0,0,0],
                        rich:{}
                    }
                },
                grid: [
                    {              
                        top: '18%',
                        bottom: '0',
                        left: '100px',
                        width: '36%',
                        containLabel: true
                    }, 
                    {            //中间隐藏
                        top: '18%',
                        bottom: '0',
                        left: '53%',
                        width: '0%',
                    },
                    {          //左边的位置
                        top: '18%',
                        bottom: '0',
                        right: '100px',
                        width: '36%',
                        containLabel: true
                    }
                ],
                xAxis: [{
                    type: 'value',
                    inverse: true,
                    show:false 
                }, 
                {
                    gridIndex: 1,
                    show: false
                }, 
                {
                    gridIndex: 2,
                    type: 'value',
                    show:false 
                }],
                yAxis: [
                {                            
                    position: 'right',
                    axisLabel: {
                        position: 'right',
                        show: false
                    },
                    type: 'category',
                    axisTick: {
                        show: false
                    },
                    data: ['科技招商例会项目','重大科技招商项目','领军企业']
                },
                {
                    gridIndex: 1,
                    position: 'center',
                    axisLine: {
                        show: false
                    }, 
                        axisLabel: {
                        position: 'right',
                    show: false
                    },
                    type: 'category',
                    axisTick: {
                        show: false
                    },
                    data: ['科技招商例会项目','重大科技招商项目','领军企业']
                },
                {   
                    gridIndex: 2,                      //右边的y坐标轴
                    position: 'left',
                    axisLabel: {
                        show: true
                    },
                    type: 'category',
                    axisTick: {
                        show: false
                    },
                    data: ['科技招商例会项目','重大科技招商项目','领军企业']
                },
                ],
                series: [
                    {
                        type: 'bar',
                        barWidth: 19,
                        name: '扶持企业（家）',
                        itemStyle: {
                            color: '#93BEFF'
                        },
                        label: {
                        show: true, // 显示标签
                        position: 'left', // 标签的位置
                        // 可以通过 formatter 自定义标签的内容
                        formatter: '{c}', // {c} 表示数据值
                        },
                        data: ['40','70','30']
                    },
                    {
                        type: 'bar',
                        barWidth: 19,
                        xAxisIndex: 2,
                        yAxisIndex: 2,
                        name: '扶持金额（万元）',
                        itemStyle: {
                            color: '#FAC858'
                        },
                        label: {
                        show: true, // 显示标签
                        position: 'right', // 标签的位置
                        // 可以通过 formatter 自定义标签的内容
                        formatter: '{c}', // {c} 表示数据值
                        },
                        data: ['6','10','7']
                    },
                ]
            };

2、对向

option代码如下

option = {
  toolbox: {
      feature: {
      saveAsImage: { show: true }
      }
  },
  tooltip: {
      show: true,
      trigger: 'axis',
      axisPointer: {
        type: 'shadow'
      }
  },
  legend: {
    left: 'center',
    // top: '6%',
    itemWidth: 20,
    itemHeight: 10,
    itemGap: 20,
    textStyle: {
        padding: [3,0,0,0],
        rich:{}
    }
  },
  grid: [
    {             
      top: '18%',
      bottom: '0',
      left: '62%',
      width: '28%',
      containLabel: true
  }, 
  {            //中间隐藏
      top: '18%',
      bottom: '0',
      left: '53%',
      width: '0%',
      height: '68%',
  },
  {        
      top: '18%',
      bottom: '0',
      right: '%',
      width: '28%',
      containLabel: true
  }
  ],
  xAxis: [{
      type: 'value',
      inverse: true,
      show:false 
  }, 
  {
      gridIndex: 1,
      show: false
  }, 
  {
      gridIndex: 2,
      type: 'value',
      show:false 
  }],
  yAxis: [
    {                       
      position: 'right',
      axisLabel: {
        position: 'right',
        show: true
      },
      type: 'category',
      axisTick: {
          show: false
      },
      data: ['科技招商例会项目','重大科技招商项目','领军企业']
    },
    {
      gridIndex: 1,
      position: 'center',
      axisLine: {
          show: false
      }, 
			axisLabel: {
        position: 'right',
        show: false
      },
      type: 'category',
      axisTick: {
          show: false
      },
     data: ['科技招商例会项目','重大科技招商项目','领军企业']
    },
    {                             
      gridIndex: 2,
      position: 'left',
      axisLabel: {
          show: true
      },
      type: 'category',
      axisTick: {
          show: false
      },
      data: ['科技招商例会项目','重大科技招商项目','领军企业']
    }
  ],
  series: [
        {
            type: 'bar',
            barWidth: 19,
            xAxisIndex: 2,
            yAxisIndex: 2,
            name: '扶持企业（家）',
            itemStyle: {
                color: '#93BEFF'
            },
            data: ['6','10','7']
        },
        {
            type: 'bar',
            barWidth: 19,
            name: '扶持金额（万元）',
            itemStyle: {
                color: '#FAC858'
            },
            data: ['40','70','30']
        }
    ]
};