I am currently working on incorporating angularjs google charts with a horizontal scrollbar that should scroll from right to left by default.
View the demo before implementing the css code for right-to-left scrolling (tooltip displayed correctly on mouseover) : Initial Demo without horizontal scrollbar
Demo after applying css code for right-to-left scrolling: Updated Demo with tooltip display issue
Here is the html code:
<div ng-controller="myController" style="width:100%;height:50%;margin-left:0;white-space: nowrap;overflow-x:auto;overflow-y:hidden;direction:rtl;left:0;top:0;">
<div style="width:90%;height:90%;" google-chart chart="myChart">
</div> </div>
This is the corresponding css code:
div[aria-label="A tabular representation of the data in the chart."] {
left: 0 !important;}
Encountering issues with tooltip display on mouseover, any suggestions?