d3 / d3-axis

Human-readable reference marks for scales.

Home Page:https://d3js.org/d3-axis

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Y-axis defect at RTL mode

Ashamandi opened this issue · comments

When I tried to add dir="rtl" in body tag at this example Line with Missing Data

hint: I replace "https://d3js.org/d3.v4.js" with "//d3js.org/d3.v4.0.0-alpha.4.min.js"-

The following error appears:

y-axis_defect

This is expected. If you add dir="rtl", you’ll need to restyle your axis as appropriate since the default tick text-anchor for a left or right axis will no longer be correct. For example, you may need to add the following style:

.axis--y {
  text-anchor: start;
}

@mbostock I have this issue too.
my solution was to set the everything to ltr which I don't think is a great workaround.
Not supporting this out-of-the-box requires every developer that needs RTL support to know this and take it into account when using d3.
I think that it should be build-in in this library.
Please consider re-opening this issue.