Ensure that controllers derived from the bar controller work correct in stacked charts

[shubham242k]

Issue Fixes #9569 and fixes #9595

What was the Issue?

when deriving a new chart type by extending BarController and using the default functionality of the default bar chart type, the bars are overlapping in a small space.

Unexpected behaviour: https://codesandbox.io/s/unexpected-behaviour-yiy8y?file=/src/index.js

Expected behaviour:

Changes Made

changes the argument passed in getMatchingVisibleMetas

Chart.js/src/controllers/controller.bar.js

Line 9 in fca0309

const metas = scale.getMatchingVisibleMetas('bar');

from 'bar' to meta._type .

getMatchingVisibleMetas returns the datasets that are visible and have type equals to meta._type

UPDATE
Also changed the argument passed in 'getMatchingVisibleMetas' at

Chart.js/src/core/core.datasetController.js

Line 132 in fca0309

for (const meta of vScale.getMatchingVisibleMetas('bar').reverse()) {

[CatchABus]

@shubham242k There is also this one: https://github.com/chartjs/Chart.js/blob/master/src/core/core.datasetController.js#L132

UPDATED: This is a different issue, therefore it's not related to this PR.

[KLN888]

This is working fine now.

[KLN888]

It's fine now anyone can check again

[CatchABus]

I tested these changes and they fix:

1. Bars overlapping
2. Styling properties not being properly applied on stacked bars

[kurkle]

A test would be good, but I'm not sure how that could be done.

[shubham242k]

A test would be good, but I'm not sure how that could be done.

I have tried to add the test case where I can put canvas inside a small size div for testing overlapping issues , But did not find a way