Easy way to rotate axis labels

[José Aurélio Posser]

Hi... I´m working with Plot for a few days and was searching a way to rotate the labels for x or y axis. 

I see a lot o discussion about that, so i´m posting a easy way via CSS, using the classes created by flot.

/* rotate the x axis labels. */

.flot-x-axis .flot-tick-label {

-webkit-transform: rotate(45deg);

-moz-transform: rotate(45deg);

-ms-transform: rotate(45deg);

-o-transform: rotate(45deg);

}

Changing the class identifier as explained in Flot API rotate other axes:

To enable more granular control over styles, labels are divided between a set of text containers, with each holding the labels for one axis. These containers are given the classes 'flot-[x|y]-axis', and 'flot-[x|y]#-axis', where '#' is the number of the axis when there are multiple axes. For example, the x-axis labels for a simple plot with only a single x-axis might look like this:

[dnschnur]

This is a nice quick & dirty solution.  You may also want to check out Mark Cote's flot-tickrotor plugin, which does a little more in terms of spacing the labels based on their rotated size.  This functionality will be integrated into the core library in 0.9.

[Gil Kasparek]

Is there an example or docs on how to rotate x-axis tick labels in flot 0.9 (presuming it's even working yet)? We ran into some issues with flot-tickrotor, and we're trying to decide whether to hold off till 0.9 or modify tickrotor. 

[dnschnur]

Rotating labels is not yet available in 0.9; it is what we're working on currently.