在 Chart.js 中隐藏网格线

Question

我尝试隐藏 Chart.js 的网格线。但是我无法隐藏它。我想要一个与下面图表相同的图表。

但是，图表结果不是我预期的。

我无法隐藏它。此外，垂直字体不能加粗。以下是图表配置（我使用 Angular 和 Chart.js 库）。

this.chartDemo = {
    title: {
      display: false,
    },
    legend: {
      position: 'right',
      display: false,
    },
    scales: {
      xAxes: [
        {
          ticks: {
            beginAtZero: true,
            max: 100,
            min: 0,
          },
          gridLines: {
            drawOnChartArea: false
          },
          display: false,
        },
      ],
      yAxes: [
        {
          display: this.handleShow(),
          gridLines: {
            drawOnChartArea: false
          }
        },
      ],
    },
    responsive: false,
    plugins: {
      grace: {
        grace: 2,
        hardMax: true,
      },
      datalabels: {
        anchor: 'end',
        align: 'end',
        rotation: 0,
        padding: 12,
        clip: false,
        labels: {
          value: {
            color: '#000',
          },
        },
        font: {
          size: '12',
          weight: 'bold',
        },
      },
    },
  };

请给我解决方案。