Multiple axis with horizontal bar and (not inverted) Line

[joseraul]

Expected behavior

I'm trying to create a single chart with bars and a line. The bars should be horizontal and the line should be "standard" (follow the x-axis). I'll post some images, so it is clearer:

The charts work separately, but when I put them together, the charts disappear.

Current behavior

It is just not working, maybe I missed something? maybe it's not possible? maybe there is a bug? You can see the result here: I will be very happy to open a PR if someone points me in the correct direction.

Reproducible sample

You can create the above charts with this example: https://codepen.io/joseraul/pen/poVxJyX

chart.js version

3.9.1

[pg99696]

Hi @joseraul , I didn't find any issue with the chart.js library. I tried to create the expected chart with few changes and it worked for me.

You can find the working example. https://codepen.io/pg99696/pen/MWGPbdj

Please let me know if you have any doubt.

[joseraul]

Hi @pg99696 ! Thanks for the reply.

The key part is that I need the line to follow an X-axis at the bottom of the chart, notice the first image that I posted. Do you think that is possible?

Cheers

[pg99696]

Hi @joseraul,

Line Chart is aligned on X-axis only.

Do you want it to map the line chart following Y-axis?

[pg99696]

Hi @joseraul,

I have tried few more changes to make it working like you were expecting but I don't think it makes any sense to read data like that.

You can check the changes for reference and let me know if you have any doubts. https://codepen.io/pg99696/pen/yLjRvPL

[joseraul]

Hi @pg99696!

You did it!! Thanks a lot, I really appreciate your help 😄

If you are courious about what kind of chart I want to do is a "volume profile", ex: https://i0.wp.com/ninjatrader.com/blog/wp-content/uploads/2020/11/VPIntro1.png?resize=640%2C384&ssl=1

Cheers