import React from 'react';

import Chart from 'react-apexcharts';

import { ApexOptions } from 'apexcharts';

​

const MyChart: React.FC = () => {

  const chartOptions: ApexOptions = {

    chart: {

      height: 350, // Add your desired height

      zoom: {

        enabled: false, // Add zoom configuration as needed

      },

    },

    colors: ['#FF5733'],

    plotOptions: {

      bar: {

        horizontal: false, // Add your plotOptions as needed

      },

    },

    dataLabels: {

      enabled: false, // Add your dataLabels configuration as needed

    },

    legend: {

      show: true,

      showForSingleSeries: false, // Add your legend configuration as needed

      horizontalAlign: 'center',

    },

  };

​

  const chartSeries = [

    {

      name: 'Series 1',

      data: [30, 40, 35, 50, 49, 60, 70, 91, 125],

    },

  ];

​

  return (

    <Chart

      options={chartOptions}

      series={chartSeries}

      type="line"

      width="500"

    />

  );

};

​

export default MyChart;