How to remove the horizontal lines of chart & its axis lines in angular?

Question

Following is an angular app with graphs made of apex charts

https://codesandbox.io/s/apx-column-distributed-d3ns7?from-embed

How can I remove the horizontal li

Answer 1

The grid-lines can be hidden using the following ways.

grid: {
    show: false
}

or

grid: {
    xaxis: {
        lines: {
            show: false
        }
    },   
    yaxis: {
        lines: {
            show: false
        }
    }
}

Edit: In your example, you were missing

  <apx-chart
    [grid]="chartOptions.grid"
  ></apx-chart>

Answer 2

in your configuration add axisBorder and axisTicks configurations, I couldn't find how to remove the horizontal bars completely though. If I find it I will be back.

xaxis
  categories: [
    ["John", "Doe"],
    ["Joe", "Smith"],
  ],
  axisBorder: {
    show: false
  },
  axisTicks: {
    show: false,
  },