Overlapping labels in x-axis

[Nemanja Djorovic]

I have this problem https://prnt.sc/l4wshs
Does someone have any idea how to abbreviate text if it's too long, for example with 3 dots at the end? 

[Larry Martell]

On Thu, Oct 11, 2018 at 11:10 AM Nemanja Djorovic <ndjor...@gmail.com> wrote:
>
> I have this problem https://prnt.sc/l4wshs
> Does someone have any idea how to abbreviate text if it's too long, for example with 3 dots at the end?

Put the tick label in a variable and test the length and if it's too
long modify it as needed. And set the tick labels in your series with
something like this:

value:value, label:label, showLabel:true, showMark:true

[Chetan Sharma]

You can mitigate this problem in two steps - 

1) Apply css to the jqplot-xaxis-tick class (returned by jqplot when it renders the chart) with max-width, overflow: hidden and text-overflow: ellipsis (Although, ellipsis might not look good when most of your labels are long)

2) As @Larry said, you can pick each label and check the length, if long (you can set a threshold), set 'title' prop with your label name, so on hover it will show full name. Ex - 

                    var ticks = chart.axes.xaxis._ticks;

                    Put ticks in loop and t = ticks[loop_index]

                    // assuming avg char width is 6 px

                    if (6 * t.label.length > avgTickWidth) {

                        t._elem.prop('title', t.label);

                    }