<template>
  <view>
    <qiun-data-charts type="area" :opts="opts" :chartData="chartData" />
  </view>
</template>
<script setup>
import { ref } from 'vue'
const opts = ref({
  color: [
    '#ee2c37',
    
  ],
  padding: [15, 15, 0, 15],
  enableScroll: false,
  legend: {
    show:false
  },
  xAxis: {
    disableGrid: true,
  },
  yAxis: {
    gridType: 'dash',
    dashLength: 2,
  },
  extra: {
    area: {
      type: 'curve',
      opacity: 0.2,
      addLine: true,
      width: 2,
      gradient: true,
      activeType: 'hollow',
    },
  },
})
const chartData = ref({
  categories: ['2016', '2017', '2018', '2019', '2020', '2021'],
  series: [
    {
      name: '目标值',
      data: [35, 36, 31, 33, 13, 34],
    }
  ],
})
</script>
