search

swimlane / ngx-charts

:bar_chart: Declarative Charting Framework for Angular
https://swimlane.github.io/ngx-charts/
MIT License
4.3k stars 1.15k forks source link

Axis label not centered with Arabic words #1177

Open Abdullah0991 opened 5 years ago

Abdullah0991 commented 5 years ago

Describe the bug My chart contains Arabic and English words as axis label, the Arabic words are seem to not be centered on the bar, I tested this problem on latest version of Chrome and FireFox browsers, in Chrome it works very well but in FF it shows this problem.

To Reproduce I am using Angular 7, here is the setup of the chart:

<ngx-charts-bar-vertical [results]="chartData" [legend]="showLegend" [view]="chartSize"
                         [xAxis]="showNamesAxis" [yAxis]="showValuesAxis" [showDataLabel]="true"
                         [trimXAxisTicks]="false" [trimYAxisTicks]="false"
                         [yAxisLabel]="valuesAxisLabel" [xAxisLabel]="namesAxisLabel"
                         [showXAxisLabel]="showNameAxisLabel" [showYAxisLabel]="showValuesAxisLabel"
                         [gradient]="gradient" [scheme]="selectedClrScheme">
</ngx-charts-bar-vertical>

Expected behavior The axis labels should be centered bellow the bar no matter what the language of the label.

Screenshots https://i.ibb.co/RyfrT5R/arabic-bug-ff.jpg

Demo Not having a time right now to prepare a demo!

ngx-charts version v11.1.0

Additional context Angular v7.2.8 FireFox v66.0.5

Abdullah0991 commented 5 years ago

Any Updates ? @marjan-georgiev