Estoy tratando de hacer un gráfico de área que tenga etiquetas de eje x que se muestren sobre el eje real. Aquí hay un ejemplo:

Tengo las etiquetas de los ejes, pero no encuentro la manera de moverlas justo encima del eje 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> ) }

Necesito que responda, pudiendo cambiar la ventana de tiempo que se grafica. Traté de hacer una función afterDraw (), sin embargo, eso no es ideal dada la necesidad de responder.