Long chart titles should wrap rather than overflow

[evansd]

It's quite easy to generate long titles if you select a few tests and a few organisations.

A couple of possibly relevant links:
https://community.plot.ly/t/wrap-long-text-in-title-in-dash/11419/3
plotly/plotly.js#382

[evansd]

It turns out this isn't really possible with Dash/Plotly as it currently stands.

It's easy enough to use textwrap.wrap to split long titles over several lines, but they then spill over the chart content. It's possible to count the number of lines, work out the approximate height, and add enough top margin to the chart so this doesn't happen. But Plotly always positions the first line of the title in the vertical centre of the top margin. So if you make it big enough to stop the title spilling on to the chart you end up with loads of whitespace above the title.

The workarounds people have come up with for this with Plotly involve poking the DOM directly with JavaScript, which isn't really an option when using Dash.

Experimental work in this branch: https://github.com/ebmdatalab/openpath-dash/compare/wrap-long-titles

[evansd]

We could probably write a function which checks for overlong titles and progessively uses tricks to make them shorter e..g using test codes instead of test names and finally using "selected tests" where the list is too long even for codes.