Dave Raiman

Missing x-axis labels

Recommended Posts

We've just upgraded our FusionCharts to the current version and I've run into a snag with the x-axis labels not all showing on the plots.  It appears that FC dynamically determine how many labels to display based on display space.  The problem is that it's very erratic sometimes showing even just one label.  Other size windows will show a block of labels in the middle of the axis.  I've used showLabels='1' labelDisplay='rotate' labelStep='1' attributes.  If I change to labelDisplay='NONE' then all labels are shown horizontally and, of course, they all smash together if the window is too small.  I was able to reproduce the error condition in this fiddle:  https://jsfiddle.net/daver1212/favpmwco/11/.  The screen captures attached are from execution of this fiddle with different window sizes.

 

 

Missing labels but plenty of room.jpg

First label and gap then middle only.jpg

Edited by Dave Raiman
Needed to fix fiddle link.

Share this post


Link to post
Share on other sites

Hi Dave,

 

In the provided fiddle, the width of the chart is set in percentage(100%). Hence, FusionCharts charts will dynamically resize the width, if the container div element width is changed. This will also dynamically show/hide the x-axis labels(chart elements) based on the available space in the current window/div size, irrespective of the attributes labelDisplay='rotate' labelStep='1'  being set at chart-level.

Please find the same chart with fixed width(in pixels) large enough to accommodate the huge number of labels : https://jsfiddle.net/Akash008/36Lwzqd8/

Also note, you have several category objects set to "showLabel" as "0", which will not show up on chart resize, so the discontinuous labels are displayed.

 

However, as a suggestion, you could remove all the "showLabel" entries in the category-level, and set the "labelSteps"(Example - 20 or 30) accordingly to get the labels uniformly displayed on resize as well.

Please find the sample fiddle : https://jsfiddle.net/Akash008/36Lwzqd8/1/

 

Hope this helps.

Thanks,

Akash.

Share this post


Link to post
Share on other sites

I would love it if FC would dynamically adjust the labels based on the amount of space available in a consistent way.  The two solutions you offered (thanks for that!) both forced static quantity of labels.  In my example, FC is changing the labels showing (desirable) but doing so very erratically.  

  • In one case, it leaves large spaces when it could be showing without any overlap all the requested labels (one each hour).
  • In the other case, it is showing all the expected labels but only in the middle section leaving the first and last third of the chart void of labels.

Neither one of those seems like reasonable expected output.  If I have to, I'll code to manually show a specific number of visible labels based on the smallest normal width as we did in the older version but it seems like the dynamic labeling isn't working correctly leaving "random" labels out.  In the current case, we have 48 labels (one for each hour)  on approximately 288 categories (6 data points per hour) which would fit easily on my 4k monitor and fits, though more tightly, on a 1920 window.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now