dmcgavin
Posts: 28
Joined: Mon Jul 13, 2009 2:22 pm

How do I add titles to 2 pie charts rendered in the same chart container

I want to add a title to each pie chart. How can I do that? The title: tag doesn't show up

https://jsfiddle.net/rdmcgavin/ghuwxfq2/10

Thanks
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: How do I add titles to 2 pie charts rendered in the same chart container

Hello,

The title in Highcharts is only applicable to the container. So if you have two charts in your container (just like you do in your demo), the title will only show up in the middle of it.

To achieve that, you have two options. The first one would be to put your charts in separate containers. The second would be to remove the original title and create your own ones for each chart using Highcharts.SVGRenderer.

I have implemented this feature in your demo, please take a look at it.
The original title is set to an empty string, I have added a chart margin (to make some space for the rendered titles).

DEMO: https://jsfiddle.net/BlackLabel/bz90xr6h/
SVGRenderer: https://api.highcharts.com/class-refere ... VGRenderer

Let me know if that's what you were looking for!
Have a good day
Kamil Musiałowski
Highcharts Developer
dmcgavin
Posts: 28
Joined: Mon Jul 13, 2009 2:22 pm

Re: How do I add titles to 2 pie charts rendered in the same chart container

Exactly what I needed! Thank you!
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: How do I add titles to 2 pie charts rendered in the same chart container

I'm glad that I could help you!

Do not hesitate to contact us with any further questions,
Best regards!
Kamil Musiałowski
Highcharts Developer
dmcgavin
Posts: 28
Joined: Mon Jul 13, 2009 2:22 pm

Re: How do I add titles to 2 pie charts rendered in the same chart container

I updated the jsfiddle and tried to get it to be responsive. Is that possible?

https://jsfiddle.net/rdmcgavin/ghuwxfq2/19/

Thanks
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: How do I add titles to 2 pie charts rendered in the same chart container

Sure it is very easy to achieve that.

Titles are already responsive, so the only missing part is making the pie charts responsive. In that case, simply change the center property from numbers to percentages in strings:

Code: Select all

center: ['50%', '25%']
Fixed DEMO: https://jsfiddle.net/BlackLabel/Lb3egp0z/

Let me know if that's what you wanted to achieve,
Best regards!
Kamil Musiałowski
Highcharts Developer
kamil.m
Posts: 892
Joined: Thu May 19, 2022 1:33 pm

Re: How do I add titles to 2 pie charts rendered in the same chart container

I'm glad that I could help you.

Do not hesitate to contact us with any further questions,
Regards!
Kamil Musiałowski
Highcharts Developer

Return to “Highcharts Usage”