zard
Posts: 14
Joined: Fri Nov 10, 2023 8:15 pm

Moving yaxis title

Hi there,

I need to reposition the y-axis title of the bar chart to match the design specifications. I've been unable to find a solution. Could you please guide me on how to achieve this?

Thanks!
Attachments
Screenshot 2024-05-21 at 12.24.56 PM.png
Screenshot 2024-05-21 at 12.24.56 PM.png (12.93 KiB) Viewed 706 times
User avatar
dawid.d
Site Moderator
Posts: 960
Joined: Thu Oct 06, 2022 11:31 am

Re: Moving yaxis title

Hello,

Thanks for the question!

You can use the x and y options for the yAxis title: https://api.highcharts.com/highcharts/yAxis.title.x

But you can also use the renderer to render the labels as only you want: https://api.highcharts.com/class-refere ... VGRenderer

Demo: https://jsfiddle.net/gh/get/library/pur ... r-on-chart

Let me know if it was helpful for you!
Best regards
Dawid Draguła
Highcharts Developer
zard
Posts: 14
Joined: Fri Nov 10, 2023 8:15 pm

Re: Moving yaxis title

Hi dawid.d,
Thanks for reply, I was able to move it successfully using x and y:

Code: Select all

 labels: {
    align: 'left',
    x: 1,
    y: 28,
  },

However, the issue is that I have different charts with varying data and bar widths. If I set a value for y, it works for some charts but not for all of them. For example it works for this one:

Screenshot 2024-06-12 at 11.57.28 AM.png
Screenshot 2024-06-12 at 11.57.28 AM.png (16.82 KiB) Viewed 100 times

but not for this one:

Screenshot 2024-06-12 at 11.57.46 AM.png
Screenshot 2024-06-12 at 11.57.46 AM.png (12.55 KiB) Viewed 100 times

how I can make the y to be dynamic?
User avatar
dawid.d
Site Moderator
Posts: 960
Joined: Thu Oct 06, 2022 11:31 am

Re: Moving yaxis title

Can you share a demo, e.g. in jsfiddle? It will be easier to show how you can render responsive labels on a chart specifically on your example.
Dawid Draguła
Highcharts Developer
zard
Posts: 14
Joined: Fri Nov 10, 2023 8:15 pm

Re: Moving yaxis title

Hi,

Thanks for your reply.

I'm not very experienced with creating JSFiddles, especially since I'm using HighchartsReact. If you could help me set up a basic JSFiddle with a bar chart, it would be much appreciated. I can then make the necessary changes on my end.

Thank you so much!
User avatar
dawid.d
Site Moderator
Posts: 960
Joined: Thu Oct 06, 2022 11:31 am

Re: Moving yaxis title

Yeah, sure! That's the simplest possible bar chart:
Demo: https://jsfiddle.net/BlackLabel/ex8abkgu/

I also tried to recreate a similar case of label occurrence, see:
Demo: https://jsfiddle.net/BlackLabel/mpntda0k/

Best regards!
Dawid Draguła
Highcharts Developer

Return to “Highcharts Usage”