Skip to Content

Design Studio: Text-orientation at info chart?

Feb 12 at 03:30 PM


avatar image

Hello Experts,

We have unique requirement to display infochart data labels in vertically (-90 degree). We achieved this requirement on Chrome browser through CSS classes mentioned below.

.CHART_DATALABEL_90DEG g.v-m-main g.v-m-plot g.v-plot-main g.v-datalabel-group g.v-datalabel:nth-child(1) text
-ms-transform: rotate(7deg) !important; -ms-transform-origin: rotate(7deg) !important; 
-webkit-transform: rotate(-90deg) !important; -webkit-transform-origin: center !important; 
transform: rotateZ(-90deg) !important; transform-origin: center !important; }

However, our solution is incomplete as the changes are not getting reflected on IE browser. IE is not supporting "Transform" CSS statement for the texts at the SVG.

We tried to solve this on IE by using the CSS statement "writing-mode: tb" in the above class itself. Again, we were able to rotate "Top to Bottom". Other than "tb" no other classes (bt-rl, bt-lr and etc.,) are getting supported here. Can some one please help us further.

10 |10000 characters needed characters left characters exceeded

Hello Powlas, We are using Design Studio 1.6 SP6. Please let me know if you need further details. - Stephen K

* Please Login or Register to Answer, Follow or Comment.

0 Answers