Merge pull request plotly#4939 from justin-sleep/fix-reversed-dividers

Fix divider placement on reversed axes

Author: archmoj

src/plots/cartesian/axes.js

@@ -2100,6 +2100,8 @@ function getDividerVals(ax, vals) {
     var out = [];
     var i, current;
 
+    var reversed = (vals.length && vals[vals.length - 1].x < vals[0].x);
+
     // never used for labels;
     // no need to worry about the other tickTextObj keys
     var _push = function(d, bndIndex) {
@@ -2113,11 +2115,11 @@ function getDividerVals(ax, vals) {
         for(i = 0; i < vals.length; i++) {
             var d = vals[i];
             if(d.text2 !== current) {
-                _push(d, 0);
+                _push(d, reversed ? 1 : 0);
             }
             current = d.text2;
         }
-        _push(vals[i - 1], 1);
+        _push(vals[i - 1], reversed ? 0 : 1);
     }
 
     return out;

test/image/baselines/reversed-axis-dividers.png

@@ -0,0 +1,47 @@
+{
+    "data": [{
+        "type": "bar",
+        "y": [
+            5,
+            10,
+            15,
+            20,
+            25,
+            30,
+            35,
+            40
+        ],
+        "x": [
+            [
+                "1st",
+                "1st",
+                "2nd",
+                "2nd",
+                "3rd",
+                "3rd",
+                "4th",
+                "4th"
+            ],
+            [
+                "Yes",
+                "No",
+                "Yes",
+                "No",
+                "Yes",
+                "No",
+                "Yes",
+                "No"
+            ]
+        ]
+    }],
+    "layout": {
+        "width": 800,
+        "height": 400,
+        "title": {
+            "text": "Reverse-Autoranged X-Axis"
+        },
+        "xaxis": {
+            "autorange": "reversed"
+        }
+    }
+}