3

If you look here: https://plotly.com/python/treemaps/#nested-layers-in-treemap, looking at the image: enter image description here

Note the tiny text in the second small block. You can hardly see it because the text is "Blackcurrant-like", and it's too big to fit.

None of the current options proposed in the documentation are sufficient.

Proposed solution 1: Force the font size to be bigger, hide if it won't fit.

By adding this line:

    fig.update_layout(uniformtext=dict(minsize=11, mode='hide'))

It hides labels that don't fit:

enter image description here

And that's not very good. I want to be able to see the text.

Proposed solution 2: Force the font size to be bigger, force show if it won't fit.

    fig.update_layout(uniformtext=dict(minsize=11, mode='show'))

enter image description here

That solves the problem in the text hiding, but now it draws outside of the box, which is not good.

What I would like is for the text to wrap. If that's not possible, then I would like it to trim (possibly with ellipses). I can't figure out a way to do either with this library. So my first question is, is it possible?

Proposed solution 3: Trim text ahead of time.

If I knew ahead of time that the text won't fit, I could trim it. But how do I know that, and how can I tell by how much I can trim it? I suppose, since the the size of the box is indirectly related to the value we pass it, we can make a guess as to which boxes are going to be too small for the text we pass in. But how? I don't even know the shame of the box. Below it's a tall rectangle. There's no way for me to guess that.
If there was an event I can hook on where the UI calls me back before rending the text, giving me the dimensions of the square, allowing me to change the text, I might have a chance.

Any suggestions?

Seems silly to have all that space in the box that I can't populate. I'm assuming there's some technical reason why the text can't wrap since that would have been the most obvious solution.

zumalifeguard
  • 8,648
  • 5
  • 43
  • 56
  • When the box is too small, do you want single words to also wrap even if wraps from the middle of the word? – Derek O Jan 29 '21 at 07:57
  • I'll take anything at this point, but word-breaks would be ideal. – zumalifeguard Feb 02 '21 at 18:56
  • 1
    I have no idea why the text can't wrap and I agree that this feature would be useful across all Plotly graph_objects — and not just for treemaps. The boxes resize as the browser window changes which makes things trickier, but I'll see what I can figure out – Derek O Feb 03 '21 at 08:34
  • Hi there, I ran into the same problem and I think one solution could be to use the library textwrap, in order to trim the text with a given width. See this question : https://stackoverflow.com/questions/62151608/how-to-wrap-text-in-plotly-pys-sunburst-diagram – Vincent Sep 07 '21 at 13:00
  • 1
    @Vincent thank you for your reply, but this doesn't work for me because i would have to know what the width is ahead of time. The whole point of a TreeMap is that the width is dynamic -- it's calculated dynamically using the tree-map algorithm which you'd have to duplicate exactly to determine the width ahead of time. At that point, might as well fork the plotly library and make the change there. – zumalifeguard Sep 07 '21 at 14:20

1 Answers1

1

You can wrap your text manually by using <br> among the text, take this example here:

import plotly.express as px

df = px.data.tips()
fig = px.treemap(df, path=[px.Constant("all"), 'day', 'time', 'sex'], values='total_bill')
fig.update_traces(root_color="lightgrey")
fig.update_layout(margin = dict(t=50, l=25, r=25, b=25))
fig.show()

enter image description here

I will add a long label with manual wrapping.

fig.data[0]['labels'][0:6] = "This is too long label <br> but it is wrapped <br> into three lines"
fig.data[0]['textfont']['size'] = 20
fig.show()

enter image description here

Hamzah
  • 8,175
  • 3
  • 19
  • 43