Fix title overflowing chart.

[rouilj]

Using the URL: http://localhost:8080/demo/issue?@template=chart&@charttype=multibarchart&@columns=id,activity,title,creator,assignedto,status&@sort=-activity&@group=priority,status&@filter=status&@pagesize=50&@startwith=0&status=-1,1,2,3,4,5,6,7

you can see that the title overflows the box and is clipped.

This is due to my use of CSS to set:

font-size: 20px !important;

for the plot title. This should be done by setting the style via pygal. See: https://www.pygal.org/en/stable/documentation/custom_styles.html?highlight=font%20size#. Hopefully this will let pygal's code to wrap the title work correctly.

Set up a custom style that implements the title font size of 20px (or equivalent).

I also set the legend text size to 8px. Once you have fixed the title font size, open a new issue to fix the legend text. Reference this ticket so that somebody can fix it using your custom style.

using the custom style you created on this ticket.

[rouilj]

With other changes (title reword/shorten), the overflow may not be visible. To recreate:

Find the location in chart.py where the title is set for the MultiBarChart. It will look something like:

        chart.title = db.i18n.gettext("Tickets grouped by %(propertyName1)s and %(propertyName2)s \n(%(trackerName)s)"
                                       %{
                                           'propertyName1': db.i18n.gettext(arg['group'][0][1]),
                                           'propertyName2': db.i18n.gettext(arg['group'][1][1]),
                                           'trackerName' : db.config.TRACKER_NAME
                                       } )

Make sure you are using the MultiBarChart's handler() method. Similar lines like this exist for every chart class.

Add more words before Tracker and restart your tracker to make the title longer until it overflows.

[rouilj]

Varshitha, What commit has these fixes?