Kozea / pygal

PYthon svg GrAph plotting Library
https://www.pygal.org
GNU Lesser General Public License v3.0
2.63k stars 411 forks source link

Pie chart slice label centering and word wrapping #481

Open Wenzil opened 4 years ago

Wenzil commented 4 years ago

Hi,

First of all thanks for making this library available. Love that there are no dependencies!

I'm running into an issue with the position and word wrapping of labels in pie chart slices. Here's the code:

import pygal

chart = pygal.Pie(
    print_labels=True,
    show_legend=False
)
chart.add('First', [{'value': 2, 'label': 'This is the first'}])
chart.add('Second', [{'value': 2, 'label': 'This is the second'}])
chart.add('Third', [{'value': 2, 'label': 'This is the third'}])
chart.render_to_file('test.svg')

As you can see from the result below, the labels are originating from the center of the slices. I need to position them so that they are centered w.r.t the middle point of each slice. Also, if the text is too long e.g. in the third slice, I need the text to wrap to the next line below.

If not possible out of the box, are there any workarounds to achieve either of those?

Thanks in advance!

Screen Shot 2019-12-11 at 12 41 28 AM
Wenzil commented 4 years ago

I was able to get text centering with this piece of custom css:

{{ id }}.text-overlay text.label {
    text-anchor: middle;
}

However, word wrapping or use of white-space: pre; for preserving new lines still doesn't work unfortunately.

Zystral commented 4 years ago

I would also like to second the desire to have this function. But moreover it would be better to have as much control in label positioning as with bar charts. My pie chart looks as: image I'm also rendering/exporting straight to png due to how these charts are being used, so I can't edit the css as the above user.

Preferably I'd like to have the labels exist on the outside of the chart, just next to the arc of their respective slices.