update ticks when panning sectors using new wrap180 routine

... so that the resulting ticks (via Axes.doTicks) are the
    same as via a relayout. Note that wrap180 is called also
    when coercing `valType: 'angle'` attributes.

Author: etpinard

src/lib/angles.js

@@ -22,3 +22,8 @@ exports.wrap360 = function(deg) {
     var out = deg % 360;
     return out < 0 ? out + 360 : out;
 };
+
+exports.wrap180 = function(deg) {
+    if(Math.abs(deg) > 180) deg -= Math.round(deg / 360) * 360;
+    return deg;
+};

src/lib/coerce.js

@@ -18,6 +18,7 @@ var colorscaleNames = Object.keys(require('../components/colorscale/scales'));
 var nestedProperty = require('./nested_property');
 var counterRegex = require('./regex').counter;
 var DESELECTDIM = require('../constants/interactions').DESELECTDIM;
+var wrap180 = require('./angles').wrap180;
 
 exports.valObjectMeta = {
     data_array: {
@@ -184,10 +185,7 @@ exports.valObjectMeta = {
         coerceFunction: function(v, propOut, dflt) {
             if(v === 'auto') propOut.set('auto');
             else if(!isNumeric(v)) propOut.set(dflt);
-            else {
-                if(Math.abs(v) > 180) v -= Math.round(v / 360) * 360;
-                propOut.set(+v);
-            }
+            else propOut.set(wrap180(+v));
         }
     },
     subplotid: {

src/lib/index.js

@@ -81,6 +81,7 @@ var anglesModule = require('./angles');
 lib.deg2rad = anglesModule.deg2rad;
 lib.rad2deg = anglesModule.rad2deg;
 lib.wrap360 = anglesModule.wrap360;
+lib.wrap180 = anglesModule.wrap180;
 
 var geom2dModule = require('./geometry2d');
 lib.segmentsIntersect = geom2dModule.segmentsIntersect;

src/plots/polar/polar.js

@@ -29,6 +29,7 @@ var MID_SHIFT = require('../../constants/alignment').MID_SHIFT;
 var deg2rad = Lib.deg2rad;
 var rad2deg = Lib.rad2deg;
 var wrap360 = Lib.wrap360;
+var wrap180 = Lib.wrap180;
 
 var setConvertAngular = require('./helpers').setConvertAngular;
 var constants = require('./constants');
@@ -587,13 +588,19 @@ proto.updateMainDrag = function(fullLayout, polarLayout) {
             else return;
         }
 
+        var crossedOrigin = (
+            sign(x0 - cxx) * sign(x1 - cxx) === -1 &&
+            sign(cyy - y0) * sign(cyy - y1) === -1
+        );
+        if(crossedOrigin) rr0 = 0;
+
         r0 = Math.min(rr0, rr1);
         r1 = Math.min(Math.max(rr0, rr1), radius);
 
         var path1;
         var cpath;
 
-        if(r1 - r0 > MINZOOM) {
+        if(r1 - r0 > MINZOOM || crossedOrigin) {
             path1 = path0 + pathSectorClosed(r1, sector) + pathSectorClosed(r0, sector);
 
             var a = xy2a(x1, y1);
@@ -667,13 +674,9 @@ proto.updateMainDrag = function(fullLayout, polarLayout) {
         );
 
         var angularAxis = _this.angularAxis;
-        angularAxis.position = angle1;
+        angularAxis.position = wrap180(angle1);
 
         if(angularAxis.type === 'linear' && !isFullCircle(sector)) {
-            // TODO must wrap360 or something to get just right
-            // on large pan
-            // or maybe a wrap180 ??
-
             angularAxis.range = sector0
                 .map(deg2rad)
                 .map(angularAxis.unTransformRad)