Another truncated text

plotly.js
1

Hi
I have a problem (see picture below) where the tick texts are too long (and truncated) and it covers the X axis title. I’ve tried to search the forum and did some googling but there is no luck. So, I raise this question.

The thing is I’m integrating plotly to an application that will generate chart dynamically (the number of columns will vary). So, there is no way I can hardcode margin or insert hardcoded ellipsis for long text. I need a way to do this automatically. I have an idea in mind where I calculate the width of each tick text and truncate them if they are greater than a certain threshold then use tickvals and ticktext. However, to find that threshold I need to find the width of each column. How do I do this? Is there a way I can get the width of each column that plotly generate (and possibly get the tick angle as well)? I don’t want to set the width because I want to leave it to plotly.
Anyone has a better idea ?
Many thanks in advance

long tick.png700×450 10.2 KB

2

@rusmin Hi Bro,

share here, if you find solutions for this.

3

Hi
I solve the problem by finding out the size of the text (find width/height). Once I get the width/height, then check whether it’s over the boundary or not. If yes, just truncate the string until it fits (the width/height just fits). The truncation is up to you. You can use … at the end or … in the middle.
Hope this helps.