Unable to create Stacked Grouped Bar Chart with chart.js / react-chartjs-2 in React

1
votes

I see on their website that there is an option to create a stacked group bar chart (As seen here: http://www.chartjs.org/samples/latest/charts/bar/stacked-group.html) , but I cannot manage to create one in React using either chart.js or react-chartjs-2.

Has anyone done this before?

Versions:

react-chartjs-2: 2.6.4

chart.js: 2.6.0

I downgraded since I saw many people who advised on doing so but also with the updated versions I am unable to find the proper settings..

Thanks!

UPDATE

This worked:

 <Bar
    data={data}
    width={400}
    height='150'
    options={{
        tooltips: {
            mode: 'point',
            intersect: false,
        },

        responsive: true,
        scales: {
            xAxes: [{
                stacked: true,
            }],
            yAxes: [{
                ticks: {
                    beginAtZero: true
                },
                stacked: false
            }]
        }
    }}
/>
1
reactjschart.js

1 Answers

0
votes

Have you tried this?

var stackedBar = new Chart(ctx, {
    type: 'bar',
    data: data,
    options: {
        scales: {
            xAxes: [{
                stacked: true
            }],
            yAxes: [{
                stacked: true
            }]
        }
    }
});