<template>
  <div>
    <xlm-line-chart :data="data" :config="config" />
  </div>
</template>

<script>

export default {
  data() {
    return {
      data: [],
      config: {
        x: {
          tickCount: 5
        },
        y: {
          name: '单位1222',
          tickCount: 7
        },
        color: 'type',
        colorList: ['red', 'blue'],
        area: true,
        point: false,
        xScroll: true,
        title: '123标题',
        tooltip: true
      }
    }
  },
  created() {
    setTimeout(() => {
      this.data = [
        {
          day: '1999-10-1',
          value: 300,
          type: 'a'
        }, {
          day: '2000-10-1',
          value: 400,
          type: 'a'
        }, {
          day: '2001-10-1',
          value: 350,
          type: 'a'
        }, {
          day: '2002-10-1',
          value: 500,
          type: 'a'
        }, {
          day: '2003-10-1',
          value: 490,
          type: 'a'
        }, {
          day: '2004-10-1',
          value: 600,
          type: 'a'
        }, {
          day: '2005-10-1',
          value: 1000,
          type: 'a'
        }, {
          day: '2006-10-1',
          value: 300,
          type: 'a'
        }, {
          day: '2007-10-1',
          value: 400,
          type: 'a'
        }, {
          day: '2008-10-1',
          value: 350,
          type: 'a'
        }, {
          day: '2009-10-2',
          value: 500,
          type: 'a'
        }, {
          day: '2010-10-3',
          value: 490,
          type: 'a'
        }, {
          day: '2011-10-4',
          value: 600,
          type: 'a'
        }, {
          day: '1999-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2000-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2001-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2002-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2003-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2004-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2005-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2006-10-1',
          value: 300
        }, {
          day: '2007-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2008-10-1',
          value: 300,
          type: 'b'
        }, {
          day: '2009-10-2',
          value: 300,
          type: 'b'
        }, {
          day: '2010-10-3',
          value: 300,
          type: 'b'
        }, {
          day: '2011-10-4',
          value: 300,
          type: 'b'
        }
      ]
    }, 1000)
  }
}
</script>
