Chartjs-How to remove Grid lines and axes in angular ng2-charts?

by

1👍

✅

You can set the option to false like this:

lineChartOptions: ChartOptions  = {
    scales: {
      x: {
        grid: {
          display: false,
        },
      },
      y: {
        grid: {
          display: false,
        },
      },
    },
  };

1👍

To remove the grid lines, you can adjust the lineChartOptions to specify that grid lines should not display for both x and y axes.

Update your lineChartOptions as follows:

    lineChartOptions: ChartOptions = {
    responsive: true,
    scales: {
      x: { // for x-axis
        grid: {
          display: false
        }
      },
      y: { // for y-axis
        grid: {
          display: false
        }
      }
    },
    elements: {
      point: {
        radius: 0,
      },
      line: {
        borderWidth: 1
      }
    }
};

Leave a comment