import React from 'react'
import ReactApexChart from 'react-apexcharts';

export default function AreaChart() {
         
    var options = {
    series: [{
        name: 'value',
        data: [31, 40, 28, 51, 42, 109, 100]
      }, 
    //   {
    //     name: 'series2',
    //     data: [11, 32, 45, 32, 34, 52, 41]
    //   }
    ],
      options:{
          chart: {
            height: 350,
            type: 'area',
            zoom: {
                enabled: false
              }
          },
          dataLabels: {
            enabled: false
          },
          stroke: {
            curve: 'smooth'
          },
          xaxis: {
            // type: 'datetime',
            // categories: ["2018-09-19T00:00:00.000Z", "2018-09-19T01:30:00.000Z", "2018-09-19T02:30:00.000Z", "2018-09-19T03:30:00.000Z", "2018-09-19T04:30:00.000Z", "2018-09-19T05:30:00.000Z", "2018-09-19T06:30:00.000Z"]
            type: 'text',
            categories: ["mon", "tues", "wed", "thur", "fri", "sat", "sun"]
          },
        //   tooltip: {
        //     x: {
        //       format: 'dd/MM/yy HH:mm'
        //     },
        //   },
      }
    };

  return (
    <ReactApexChart {...options} type="area" height={'60%'} className='w-full' />
  )
}