Estoy tratando de obtener un gráfico de barras apiladas con dos barras que comparten una etiqueta una al lado de la otra en el eje x, pero tengo problemas para mostrar la segunda barra; actualmente se encuentra debajo de la primera barra (si oculta el valor de 2021, verá que aparecerá la barra de 2022):
var barChartData = { labels: ["January", "February"], datasets: [{ data: [10, 20], label: '2021', backgroundColor: "#ffe100", yAxisId: 'y-stacked', }, { data: [15, 30], label: '2021 Total', backgroundColor: "#ee0000", yAxisId: 'y-stacked', }, { data: [6, 19], label: '2022 YTD', backgroundColor: "#555555", }] }; var ctx = document.getElementById("canvas").getContext("2d"); window.myBar = new Chart(ctx, { type: 'bar', data: barChartData, options: { title: { display: true, text: "Chart.js Bar Chart - Stacked" }, tooltips: { mode: 'label' }, responsive: true, scales: { xAxes: [{ stacked: true, }], yAxes: [{ stacked: false, ticks: { beginAtZero: true, } }, { id: "y-stacked", stacked: true, display: false, ticks: { beginAtZero: true, min: 0, }, type: 'linear' }] } } }); <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.bundle.js"></script> <div style="width: 100%"> <canvas id="canvas"></canvas> </div>¿Hay alguna forma de que la barra de 2022 se muestre junto a la barra de 2021? Intenté agregar otro eje x y cambiar el valor de la pila del eje x a falso, pero esto simplemente desapila las tres barras y las coloca una al lado de la otra.