vue使用echarts实现水平柱形图

文件结构:

testData.js文件

const dtuEdition = {
  name: '有方有线',
  number: 60,
  proportion: 40,
  edition: {
    '有方有线V1.0.0': 20,
    '有方有线V1.2.0': 15,
    '有方有线V2.0.1': 10,
    '有方有线V3.0.0': 8,
    '有方有线V3.2.0': 5,
    '有方有线V3.4.0': 4,
    '有方有线V4.0.0': 3,
    '有方有线V4.0.2': 2,
    '有方有线V4.0.3': 1
  }
}

export default {
  namespaced: true, // 用于在全局引用此文件里的方法时标识这一个的文件名
  dtuEdition
}

dtuDistributionCurve.js文件

// DTU连接率bar图的option
let barOption = {
  grid: {
    // width: '85%', // 设置gird宽度
    left: 40,    // gird距离容器左边距
    right: 65,
    top: 20,
    bottom: 0,
    containLabel: true
  },
  xAxis: {
    show : false,