Próbuję zaimplementować schemat słupkowy z flotą wtyczki jQuery. Muszę pokazać etykiety zamiast liczb na osi X, a te etykiety mogą być bardzo długie.jQuery flot: diagram słupkowy z bardzo długimi etykietami osi
jestem w stanie obrócić etykiety za pomocą CSS, tak, że nie pokrywają się:
.flot-x-axis div.flot-tick-label {
/* Rotate Axis Labels */
transform: translateX(50%) rotate(20deg); /* CSS3 */
transform-origin: 0 0;
-ms-transform: translateX(50%) rotate(20deg); /* IE */
-ms-transform-origin: 0 0;
-moz-transform: translateX(50%) rotate(20deg); /* Firefox */
-moz-transform-origin: 0 0;
-webkit-transform: translateX(50%) rotate(20deg); /* Safari and Chrome */
-webkit-transform-origin: 0 0;
-o-transform: translateX(50%) rotate(20deg); /* Opera */
-o-transform-origin: 0 0;
}
Jednak użycie tego rozwiązania pojawia się unestetical pustą przestrzeń między osi y i jego etykiety. Zobacz http://jsfiddle.net/QQkfy/2/
Jest tak prawdopodobnie dlatego, że etykieta początkowo (tj. Modyfikacje przed CSS) jest wyśrodkowana pod kreskami. Jakieś pomysły, jak mogę przezwyciężyć ten problem?
To działa! Dzięki. –