PDA

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:
35761

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?

scottmartin
30 May 2012, 12:48 PM
Have you considered using the rotate property for the label:
http://dev.sencha.com/deploy/ext-4.1.0-gpl/examples/charts/ReloadChart.html

Regards,
Scott.

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

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.

scottmartin
30 May 2012, 1:27 PM
It is mentioned in the online example in the code:
http://docs.sencha.com/ext-js/4-0/#!/api/Ext.chart.axis.Axis

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?

Scott.

Aranair
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.

tzalberto
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.