Hello I have stuck with add space between stacked bar, I mean I need to add space or margin or padding between bar color
this what I'm done with
and what I want is like this
as you can see there's is space between green, red and yellow bar
are possible to add it?
I've trying to add options.layout.padding but still not working
const borderRadius = 8; const borderRadiusAllCorners = { topLeft: borderRadius, topRight: borderRadius, bottomLeft: borderRadius, bottomRight: borderRadius }; const labels = ['0%', '25%', '50%', '75%', '100%']; const data = { labels: labels, datasets: [ { label: 'LCP', data: [ 90,80,70 ], borderColor: 'green', backgroundColor: 'green', borderWidth: 0, borderRadius: borderRadiusAllCorners, borderSkipped: 'false', }, { label: 'FID', data: [ 8,15,15 ], borderColor: 'yellow', backgroundColor: 'yellow', borderWidth: 0, borderRadius: borderRadiusAllCorners, borderSkipped: 'false', }, { label: 'CLS', data: [ 2,5,15 ], borderColor: 'red', backgroundColor: 'red', borderWidth: 0, borderRadius: borderRadiusAllCorners, borderSkipped: 'false', }, ] }; const ctx = $('#cwv-chart'); const myChart = new Chart(ctx, { type: 'bar', data: data, options: { indexAxis: 'y', elements: { bar: { borderRadius: 6, borderWidth: 2, } }, scales: { x: { display: false, stacked: true, offset: true, }, y: { display: false, stacked: true } }, responsive: true, plugins: { legend: { display: false, }, title: { display: false, } } }, });<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script><script src="https://cdn.jsdelivr.net/npm/chart.js"></script><canvas id="cwv-chart" height="150"></canvas>