如何隐藏顶点图表上的 x 轴条？

Question

我使用 react-apexcharts 来制作下面的图表，我需要显示图表的最小视图，所以我隐藏了 x、y 轴、图例、网格和一切，但底部的这个栏没有隐藏。我在文档中找不到正确的选项！有什么办法可以隐藏它吗？

这是我得到的当前输出！

const ProductivityGraph = () => {
  const series = [{
    name: 'Series A',
    data: [23, 24, 25, 15, 25, 28, 38, 46],
  },
  {
    name: 'Series B',
    data: [20, 29, 37, 36, 44, 45, 50, 58],
  },
  ];
  const options:any = {
    chart: {
      toolbar: { // Hamburger menu at top
        show: false,
      },
      height: 350,
      type: 'line',
      zoom: {
        enabled: false,
      },
    },
    dataLabels: {
      enabled: false,
    },
    stroke: {
      curve: 'smooth',
      width: 2,
    },
    title: {
      text: undefined,
      align: 'left',
    },
    grid: {
      show: false,
    },
    legend: {
      show: false,
    },
    xaxis: {
      show: false,
      labels: {
        show: false,
      },
      
    },
    yaxis: {
      show: false,
      labels: {
        show: false,
      },
      axisBorder: {
        show: false,
      },
      axisTicks: {
        show: false,
      },
      crosshairs: {
        show: false,
      },
      tooltip: {
        enabled: false,
      },
     
    },
  };
  return (
    <div>
      <ReactApexChart options={options} series={series} type="line" width={250} />
    </div>
  );
};

Answer 1

在您的选项中将 xaxis 替换为以下

xaxis: {
  show: false,
  labels: {
    show: false
  },
  axisBorder: {
    show: false
  },
  axisTicks: {
    show: false
  }
},

如何隐藏顶点图表上的 x 轴条？

how to hide x axis bar on apex chart?

charts

reactjs

apexcharts