En mi gráfico de barras Chart.js , cada etiqueta tiene alrededor de 6 conjuntos de datos. Algunos de estos conjuntos de datos tienen el valor "0". Esto da como resultado espacios vacíos en el eje x, consulte:

Me gustaría eliminar estos espacios vacíos. ¿Cómo debería hacer esto?

Después de que mi código se procesa desde la base de datos, se ve así. Tenga en cuenta que, en aras de la simplicidad, he reducido mucho el código para que consista en solo dos años. La imagen de arriba muestra solo un año.

 const labels = [2019, 2020]; const data = { labels: labels, datasets: [{ label: 'Dataset 1', data: ['0','0'] }, { label: 'Dataset 2', data: ['0', '300'] }, { label: 'Dataset 3', data: ['0','360'] }, { label: 'Dataset 4', data: ['0','0'] }, { label: 'Dataset 5', data: ['0','0'], }, { label: 'Dataset 6', data: ['0', '1020'] }] };

Reemplazar el "0" por "null" no ayuda. Necesito incluir el "0" / "null", de lo contrario, todos los conjuntos de datos se cambiarán al año equivocado. Sin embargo, como se mencionó, no quiero perder espacio porque los conjuntos de datos son diferentes por año y seguirán muchos más conjuntos de datos.

¿Debo representar los conjuntos de datos en un estilo diferente? ¿Debo usar un complemento para ocultar estos espacios vacíos?

¡Muchas gracias!