Vue 中 ECharts5.2.2 柱状图
Vue 中 ECharts5.2.2 柱状图
Vue 中 ECharts5.2.2 柱状图

柱状图__垂直

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
option = {
  xAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  yAxis: {
    type: 'value'
  },
  series: [
    {
      data: [120, 200, 250, 80, 70, 110, 130],
      type: 'bar',
    }
  ]
};

控制最大最小值

1
2
3
4
5
6
7
yAxis: [
  {
    type: 'value',
    min: 0,
    max: 50
  }
],

柱状图__水平

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
option = {
  xAxis: {
    type: 'value',
  },
  yAxis: {
    type: 'category',
    data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
  },
  series: [
    {
      data: [120, 200, 250, 80, 70, 110, 130],
      type: 'bar',
    }
  ]
};

底部footer