我正在尝试制作一个面积图，使X轴标签显示在实际坐标轴的上方。下面是一个示例：

我有轴标签，但无法将其移动到X轴上方

Chart.register(CategoryScale, LinearScale, PointElement, LineElement, Title, Filler)

const options = {
  layout: { padding: { top: 50 } },
  responsive: true,
  elements: {
    line: {
      tension: 0.4, // makes the line smoother
    },
    point: {
      radius: 0,
    },
  },
  scales: {
    x: {

      grid: {
        display: false, // hides lines in background
        drawBorder: false,
      },
    },
    y: {
      beginAtZero: true,
      grid: {
        display: false, // hides lines in background
        drawBorder: false,
      },
      ticks: {
        display: false,
      },
    },
  },
}

const chartData = {
  labels: ['JAN', 'FEB', 'MAR', ...],
  datasets: [
    {
      data: [12, 79, 56, ...],
      borderWidth: 5,
    },
  ],
}

export const Graph = () => {
  return (
    <div>
      ....
      <Line plugins={plugins} options={options} data={chartData} />
    </div>
  )
}

我需要它的响应性，能够改变时间窗口的图形。我试图做一个afterDraw（）函数，但这是不理想的需要响应。