Support text wrap for titles and subtitles

[ndrezn]

Titles and subtitles in Plotly charts overflow by default. It's impossible to have them wrap.

With subtitle support, having long strings in this area is more common (and more useful), so we should automatically wrap text if it gets too long in the title or subtitle area.

fig = px.line(x=[1,2,3], y=[4,5,6], title="This is a really really really really really really really really really really really really really really reallyy long title")
fig.update_layout(title_subtitle_text="This is a really really really really really really really really really really really really really really  really really really really really really really long subtitle")
fig

[eliasdabbas]

FWIW, I usually use <br> to introduce line breaks, but would love to see how this evolves, and if it changes. Maybe support more HTML tags than what is currently supported.

fig = px.line(x=[1,2,3], y=[4,5,6], title="This is a really really really really really really <br>really really really really really really <br>really really reallyy long title", height=600)
fig.update_layout(title_subtitle_text="This is a really really really really really really really<br> really really really really really really<br> really  really really really really really really really long subtitle")
fig.layout.margin.t = 220
fig

[ndrezn]

Yeah, <br> is a solid workaround, but in the context of responsive design we want automatic text wrapping.

Would be nice too to support more HTML tags! Although it's another can of worms to fully (and safely) support inner HTML 😉

[eliasdabbas]

Oh, I didn't think of the effects on responsiveness. Great point. I realize it can be tough to safely add more HTML tags :) Thanks!

[kburchfiel]

Yes, this would be a huge help! For instance, it's great that maps and map legends scale automatically to fit whatever display I'm using (provided that I don't fix the width and height). However, when creating maps that will be seen both on mobile devices and desktops, I don't have a great option for longer map titles: if I add in <br> tags to wrap them, they may look strange on desktop browsers--but if I exclude the <br> tags, they'll overflow mobile displays.