<template>
  <v-chart
    style="width:100%;height:100%"
    :auto-resize="true"
    :options="option"/>
</template>
<script>
let option = {
  color: ['#FECA62', '#4ECAD0', '#FE645F'],
  tooltip: {
    trigger: 'axis',
    axisPointer: { // 坐标轴指示器，坐标轴触发有效
      type: 'shadow' // 默认为直线，可选为：'line' | 'shadow'
    }
  },
  legend: {
    top: 10,
    right: 20
  },
  grid: {
    top: 40,
    left: 20,
    right: 20,
    bottom: 20,
    containLabel: true
  },
  xAxis: [
    {
      type: 'value',
      axisLine: {
        lineStyle: {
          color: '#999'
        }
      }
    }
  ],
  yAxis: [
    {
      type: 'category',
      data: ['成人票', '学生票', '军人票', '优惠票', '半票'],
      axisLine: {
        lineStyle: {
          color: '#999'
        }
      },
      axisTick: {
        alignWithLabel: true
      }
    }
  ],
  series: [
    {
      name: '驴妈妈',
      stack: 'ota',
      type: 'bar',
      barWidth: '60%',
      data: [52, 200, 134, 50, 120]
    }, {
      name: '携程',
      stack: 'ota',
      type: 'bar',
      barWidth: '60%',
      data: [50, 52, 200, 134, 120]
    }, {
      name: '飞猪',
      stack: 'ota',
      type: 'bar',
      barWidth: '60%',
      data: [100, 52, 200, 334, 120]
    }
  ]
}
export default {
  data () {
    return {
      option
    }
  },
  mounted () {
  }
}
</script>
