View Full Version : Extjs 4.0 Bar Chart, how to configure the size of the text items in the Category Axis

Syed Huda
30 May 2012, 12:04 PM
I'm using EXT 4 and using Architect tool. I created a panel with Bar chart, and I attached to a store.
The Category axis has text that I want to be wrapped, because currently everything is bunched together. I would also like to reduce the size of the font in the Category axis.

This is what it currently looks like:

Note: the x-axis can't display all the ten items because the Font is too big and it doesn't wrap around.
How can I control that?

30 May 2012, 12:48 PM
Have you considered using the rotate property for the label:


Syed Huda
30 May 2012, 1:15 PM
Rotating doesn't help obviously, because the line of text is very long:

I noticed there's a label config for Ext.chart.axis.Axis that I can see in Sencha Architect, you can put a "Rotate" object: {rotate: {degrees: 270}} to rotate text.

But what ELSE can I do in Label?
I don't see the "Label" config in Ext 4 documentation?
How can it be in Architect but not in the online doc? Doesn't make sense.

30 May 2012, 1:27 PM
It is mentioned in the online example in the code:

But more information could be provided.

You could slant the text at a 45 degree angle to get more room.
In your case, what would you want to see for long strings?


8 Nov 2012, 7:01 PM
Is it possible to get them to wrap?

If it exceeds the width used by the charts above for that data point, it wraps the text to the next line. I think that might be more useful than slanting it because if they are long enough slanting it still causes all sorts of problems lol.

16 Apr 2013, 1:21 PM
Have you found a solution for this?

I'm also trying to wrap text but couldn't figure out how to do it.