[vaadin charts] axis text rotation

Flow
1

Hi,
After upgrading to vaadin-charts-3.1.0-rc1, text roation has stopped working.

When look at the current vaadin-charts demo (as of 25Jun16) here: http://demo.vaadin.com/charts/#ColumnWithRotatedLabels
The css style info shows this for one of th rotated axis elements:

<text x="440.0641293851417" style="color:#808080;cursor:default;font-size:13px;font-weight:normal;font-family:Verdana, sans-serif;fill:#808080;width:400px;text-overflow:ellipsis;" text-anchor="end" transform="translate(0,0) rotate(-45 440.0641293851417 317)" y="317" opacity="1">

But when I run a chart with the same axis settings, my css for the type of element doesn’t include the tranform settings:

<text x="401.80735358872744" y="101" text-anchor="end" style="color:#444444;cursor:default;font-size:11px;font-weight:normal;font-family:Verdana, sans-serif;fill:#444444;" opacity="1">
<tspan x="401.80735358872744">21. Jun</tspan>
</text>

Of course I don’t know the version the vaadin demo is running. I’ve tried v3.0.0 but it is the same (only with other non-related errors).
Is there a special set of dependencies (e.g. an updated phantomjs or other extenral lib) that is required for vaadin charts 3.1 to rotate labels correctly?

Many thanks,
Peter

2

Hi Peter,

I checked and current demo is using vaadin-charts-3.1.0-rc1. The rotation should work in your case too.

Could you attach a code snippet with the creation of the chart that doesnt work in your case? Also mention the vaadin version you’re using. With that I can try to reproduce it.

Regards,

Guille

3

Hi Guille,
Thanks for your reply. I got it working now - it was a case of cached widgetsets.
Once I cleared the old widgetset and got the new v3.1 in from scratch it is working.
Apologies, I updated a ticket I created, and forgot to update this post!
The new charts look really good!
Many thanks,
Peter

4

Great to hear it’s working now!