problen in height in react-chart-2

Question

I created a chart and I want the height to be smaller than the width

this is my code

<Grid style={{ backgroundColor: 'yellowgreen', height: '30%' }}>
            
            <Bar data={data} plugins={[ChartDataLabels]} options={options} />
        </Grid>

this is my options

const options = {
        responsive: false,
        maintainAspectRatio: true,
        scales: {
            x: {
                stacked: true,
            },
            y: {
            stacked: true,

            grid: {
                display: true,
            },
            ticks: {
                // precision: 0,
                // max: 100,
                stepSize: 5,
            },
        }
    },

and this is a result:

Answer 1

<Grid style={{ backgroundColor: 'yellowgreen'}} height={250}>
            
            <Bar data={data} plugins={[ChartDataLabels]} options={options} />
        </Grid>

Use the height={{250}} attribute in Grid component instead on inline style.