Flip Flags

I am trying to rotate the dates at the bottom of my graph so that they look vertical or horizontal. I use flot-tickrotor , but it does not work correctly.

 xaxis: {
   rotateTicks: 110,
   mode: "time",
   timeformat: "%m/%d",
   minTickSize: [7, "day"],
   ticks: cpudatearray
 }

The end result is wrong, everything looks messy. enter image description here

+5
source share
2 answers

You might just be able to handle this with CSS instead of using a plug-in:

#flotPlaceholder div.xAxis div.tickLabel 
{    
    transform: rotate(-90deg);
    -ms-transform:rotate(-90deg); /* IE 9 */
    -moz-transform:rotate(-90deg); /* Firefox */
    -webkit-transform:rotate(-90deg); /* Safari and Chrome */
    -o-transform:rotate(-90deg); /* Opera */
    /*rotation-point:50% 50%;*/ /* CSS3 */
    /*rotation:270deg;*/ /* CSS3 */
}

Obviously, change the angle to what you are trying to achieve. If you want to use this for the y axis, just change the selector div.xAxis.

Result after testing on my own chart: enter image description here

+9
source

@ Brendan , , , , , , .

, , 5 ( , "MM DD" ), , , , "" (, , ).

. , X , 96 , , 90 , . X , , , . ( ...)

+1

All Articles