echarts横向柱形图怎么把文字显示到上面去?

Question

这是要的效果，
但我怎么调都只能这样

应该去调series还是y轴

Answer 1

option = {
  xAxis: {
    max: 'dataMax'
  },
  yAxis: {

    type: 'category',
    axisLine:{
      show:false
    },
    axisTick:{
      show:false
    },
    axisLabel:{
      show:false,
    },
    data: ['广州市番禺区1', '广州市番禺区2', '广州市番禺区3'],
    

  },
  series: [
    {
      type: 'bar',
      barGap: 0,
      data: [
        {
          value: 120,
          itemStyle: {
            color: '#fff'
          }
        },
        {
          value: 200,
          itemStyle: {
            color: '#fff'
          }
        },
        {
          value: 150,
          itemStyle: {
            color: '#fff'
          }
        },
      ],
      barWidth:40,
      label: {
        show: true,
        fontSize:18,
        position: [10, 10],
        formatter: '{b}',
      },

    },
    {
      type: 'bar',
      data: [
         {
          value: 120,
          itemStyle: {
            color: '#ff0'
          }
        },
        {
          value: 200,
          itemStyle: {
            color: '#ff0'
          }
        },
        {
          value: 150,
          itemStyle: {
            color: '#ff0'
          }
        },
      ],
      barWidth:20,
      label: {
        show: true,
        position: 'right',
      },

    }
  ],

};

Answer 2

使用series或y轴都可以实现，比如下面的案例
这是使用series实现的：https://www.makeapie.cn/echarts_content/x65Xqw5MAf.html
这是使用y轴实现的：https://www.makeapie.cn/echarts_content/xqjNqqjc_U.html

不过你的series右侧已经有数值显示了，所以可以使用y轴显示

Answer 3

主要调整yaxis的参数，下面有个例子可参考

let xdata = ['label1', 'label2', 'label3'];
option = {
  tooltip: {
    trigger: 'axis',
    axisPointer: {
      type: 'shadow'
    }
  },
  grid: {
    left: 100
  },
  toolbox: {
    show: true,
    feature: {
      saveAsImage: {}
    }
  },
  xAxis: {
    show: false
  },
  yAxis: {
    type: 'category',
    inverse: true,
    splitLine: {
      show: false
    },
    axisTick: {
      show: false
    },
    axisLine: {
      show: false
    },
    axisLabel: {
      show: true,
      inside: true,
      interval: 0,
      splitNumber: 50,
      textStyle: {
        color: '#111',
        verticalAlign: 'bottom',
        fontSize: 14,
        align: 'left',
        padding: [0, 0, 15, -5]
      }
    },
    data: xdata
  },
  series: [
    {
      type: 'bar',
      barWidth: 24,
      data: [165, 170, 30],
      label: {
        position: 'inside',
        offset: [480, -20],
        textStyle: {
          color: '#111'
        }
      }
    }
  ]
};

实现效果如图