adapt contour label clipPath segments for reversed axes

- it needs to have correct direction so that the SVG even-odd
  fill rule works.

Author: etpinard

src/traces/contour/plot.js

@@ -240,8 +240,7 @@ function makeLinesAndLabels(plotgroup, pathinfo, gd, cd0, contours, perimeter) {
         .classed('contourlabels', true);
 
     if(showLabels) {
-        var labelClipPathData = [perimeter];
-
+        var labelClipPathData = [];
         var labelData = [];
 
         // invalidate the getTextLocation cache in case paths changed
@@ -287,6 +286,13 @@ function makeLinesAndLabels(plotgroup, pathinfo, gd, cd0, contours, perimeter) {
         bounds.middle = (bounds.top + bounds.bottom) / 2;
         bounds.center = (bounds.left + bounds.right) / 2;
 
+        labelClipPathData.push([
+            [bounds.left, bounds.top],
+            [bounds.right, bounds.top],
+            [bounds.right, bounds.bottom],
+            [bounds.left, bounds.bottom]
+        ]);
+
         var plotDiagonal = Math.sqrt(xLen * xLen + yLen * yLen);
 
         // the path length to use to scale the number of labels to draw:

test/image/baselines/contour_label-reversed-axes.png

@@ -7,17 +7,39 @@
         [2, 1, 2],
         [2, 1, 2]
       ],
-      "contours": {
-        "showlabels": true
-      }
+      "contours": {"showlabels": true}
+    },
+    {
+      "type": "contour",
+      "z": [
+        [1, 2, 1],
+        [2, 1, 2],
+        [2, 1, 2]
+      ],
+      "contours": {"showlabels": true},
+      "xaxis": "x2",
+      "yaxis": "y2"
+    },
+    {
+      "type": "contour",
+      "z": [
+        [1, 2, 1],
+        [2, 1, 2],
+        [2, 1, 2]
+      ],
+      "contours": {"showlabels": true},
+      "xaxis": "x3",
+      "yaxis": "y3"
     }
   ],
   "layout": {
-    "yaxis": {
-      "autorange": "reversed"
-    },
-    "xaxis": {
-      "autorange": "reversed"
-    }
+    "grid": {"rows": 2, "columns": 2, "pattern": "independent"},
+
+    "xaxis": {"autorange": "reversed"},
+    "yaxis": {"autorange": "reversed"},
+
+    "xaxis2": {"autorange": "reversed"},
+
+    "yaxis3": {"autorange": "reversed"}
   }
 }