do not implement 'date' angular axes (for now)

... but make 'period' work for category angular axes.

Author: etpinard

src/plots/polar/helpers.js

@@ -16,6 +16,12 @@ exports.setConvertAngular = function setConvertAngular(ax) {
     var _c2rad;
     var _rad2c;
 
+    function getTotalNumberOfCategories() {
+        return ax.period ?
+            Math.max(ax.period, ax._categories.length) :
+            ax._categories.length;
+    }
+
     if(ax.type === 'linear') {
         _c2rad = function(v, unit) {
             if(unit === 'degrees') return Lib.deg2rad(v);
@@ -28,20 +34,12 @@ exports.setConvertAngular = function setConvertAngular(ax) {
     }
     else if(ax.type === 'category') {
         _c2rad = function(v) {
-            return v * 2 * Math.PI / ax._categories.length;
-        };
-        _rad2c = function(v) {
-            return v * ax._categories.length / Math.PI / 2;
-        };
-    }
-    else if(ax.type === 'date') {
-        var period = ax.period || 365 * 24 * 60 * 60 * 1000;
-
-        _c2rad = function(v) {
-            return (v % period) * 2 * Math.PI / period;
+            var tot = getTotalNumberOfCategories();
+            return v * 2 * Math.PI / tot;
         };
         _rad2c = function(v) {
-            return v * period / Math.PI / 2;
+            var tot = getTotalNumberOfCategories();
+            return v * tot / Math.PI / 2;
         };
     }
 

src/plots/polar/layout_attributes.js

@@ -147,15 +147,15 @@ var angularAxisAttrs = {
         // to make clear that axis here is periodic and more tightly match
         // `thetaunit`?
         //
+        // skip 'date' for first push
         // no 'log' for now
-        values: ['-', 'linear', 'date', 'category'],
+        values: ['-', 'linear', 'category'],
         dflt: '-',
         role: 'info',
         editType: 'calc',
         description: [
             'Sets the angular axis type.',
             'If *linear*, set `thetaunit` to determine the unit in which axis value are shown.',
-            'If *date*, use `period` to set the unit of time that determines a complete rotation',
             'If *category, use `period` to set the number of integer coordinates around polar axis.'
         ].join(' ')
     },
@@ -176,17 +176,16 @@ var angularAxisAttrs = {
     },
 
     period: {
-        valType: 'any',
+        valType: 'number',
         editType: 'calc',
+        min: 0,
         role: 'info',
-        description: ''
-
-        // 360 / 2*pi for linear (might not need to set it)
-        // and to full range for other types
-
-        // 'period' is the angular equivalent to 'range'
-
-        // similar to dtick, one way to achieve e.g.:
+        description: [
+            'Set the angular period.',
+            'Has an effect only when `angularaxis.type` is *category*.',
+        ].join(' ')
+        // Examples for date axes:
+        //
         // - period that equals the timeseries length
         //  http://flowingdata.com/2017/01/24/one-dataset-visualized-25-ways/18-polar-coordinates/
         // - and 1-year periods (focusing on seasonal change0

src/plots/polar/layout_defaults.js

@@ -10,7 +10,6 @@
 
 var Lib = require('../../lib');
 var Color = require('../../components/color');
-var Registry = require('../../registry');
 var handleSubplotDefaults = require('../subplot_defaults');
 var getSubplotData = require('../get_data').getSubplotData;
 
@@ -62,11 +61,6 @@ function handleDefaults(contIn, contOut, coerce, opts) {
             orderedCategories(dataAttr, axOut.categoryorder, axOut.categoryarray, subplotData) :
             [];
 
-        if(axType === 'date') {
-            var handleCalendarDefaults = Registry.getComponentMethod('calendars', 'handleDefaults');
-            handleCalendarDefaults(axIn, axOut, 'calendar', layoutOut.calendar);
-        }
-
         var visible = coerceAxis('visible');
         setConvert(axOut, layoutOut);
 
@@ -113,6 +107,26 @@ function handleDefaults(contIn, contOut, coerce, opts) {
                 break;
 
             case 'angularaxis':
+                // We do not support 'true' date angular axes yet,
+                // users can still plot dates on angular axes by setting
+                // `angularaxis.type: 'category'`.
+                //
+                // Here, if a date angular axes is detected, we make
+                // all its corresponding traces invisible, so that
+                // when we do add support for data angular axes, the new
+                // behavior won't conflict with existing behavior
+                if(axType === 'date') {
+                    Lib.log('Polar plots do not support date angular axes yet.');
+
+                    for(var j = 0; j < subplotData.length; j++) {
+                        subplotData[j].visible = false;
+                    }
+
+                    // turn this into a 'dummy' linear axis so that
+                    // the subplot still renders ok
+                    axType = axIn.type = axOut.type = 'linear';
+                }
+
                 if(axType === 'linear') {
                     coerceAxis('thetaunit');
                 } else {
@@ -179,7 +193,6 @@ function handleAxisTypeDefaults(axIn, axOut, coerce, subplotData, dataAttr) {
             }
         }
 
-        // TODO add trace input calendar support
         if(trace) {
             axOut.type = autoType(trace[dataAttr], 'gregorian');
         }

src/plots/polar/polar.js

@@ -446,9 +446,6 @@ proto.updateAngularAxis = function(fullLayout, polarLayout) {
             });
         };
     }
-    else if(ax.type === 'date') {
-        // ..
-    }
 
     setScale(ax, angularLayout, fullLayout);
     Axes.doAutoRange(ax);
@@ -977,8 +974,6 @@ proto.isPtWithinSector = function(d) {
         r1 = radialRange[0];
     }
 
-    // TODO add calendar support
-
     return (
         (r >= r0 && r <= r1) &&
         (isFullCircle(sector) ||

test/image/baselines/polar_categories.png

@@ -50,7 +50,8 @@
         "angle": 45
       },
       "angularaxis": {
-        "direction": "clockwise"
+        "direction": "clockwise",
+        "period": 6
       }
     },
     "polar2": {

test/image/baselines/polar_dates.png

@@ -2,19 +2,48 @@
   "data": [
     {
       "type": "scatterpolar",
-      "mode": "lines+markers",
-      "name": "",
-      "r": [5, 4, 2, 4, 3],
-      "theta": ["2017-01-01", "2017-04-01", "2017-08-01", "2017-12-01", "2018-01-01"],
+      "r": [
+          5, 4, 2, 4, 3,
+          5, 4, 2, 4,
+          5, 4, 2, 4, 3
+      ],
+      "theta": [
+          "2017-01-01", "2017-04-01", "2017-08-01", "2017-12-01",
+          "2018-01-01", "2018-03-01", "2018-10-20",
+          "2019-01-01", "2019-07-09", "2019-08-20", "2019-12-10"
+      ],
       "line": {
         "shape": "spline"
       }
-    }, 
+    },
     {
-      "mode": "lines+markers",
-      "name": "",
-      "x": [5, 4, 2, 4, 3],
-      "y": ["2017-01-01", "2017-04-01", "2017-08-01", "2017-12-01", "2018-01-01"],
+      "type": "scatterpolar",
+      "r": [
+          5, 4, 2, 4, 3,
+          5, 4, 2, 4,
+          5, 4, 2, 4, 3
+      ],
+      "theta": [
+          "2017-01-01", "2017-04-01", "2017-08-01", "2017-12-01",
+          "2018-01-01", "2018-03-01", "2018-10-20",
+          "2019-01-01", "2019-07-09", "2019-08-20", "2019-12-10"
+      ],
+      "line": {
+        "shape": "spline"
+      },
+      "subplot": "polar2"
+    },
+    {
+      "x": [
+          5, 4, 2, 4, 3,
+          5, 4, 2, 4,
+          5, 4, 2, 4, 3
+      ],
+      "y": [
+          "2017-01-01", "2017-04-01", "2017-08-01", "2017-12-01",
+          "2018-01-01", "2018-03-01", "2018-10-20",
+          "2019-01-01", "2019-07-09", "2019-08-20", "2019-12-10"
+      ],
       "line": {
         "shape": "spline"
       }
@@ -25,20 +54,39 @@
       "domain": {
         "x": [0, 0.46],
         "y": [0.54, 1]
+      },
+      "angularaxis": {
+        "rotation": 90,
+        "direction": "clockwise"
+      }
+    },
+    "polar2": {
+      "domain": {
+        "x": [0.54, 1],
+        "y": [0.54, 1]
+      },
+      "angularaxis": {
+        "period": 2629800000,
+        "rotation": 90,
+        "direction": "clockwise"
       }
     },
     "yaxis": {
       "domain": [0, 0.46]
     },
-    "legend": {
-      "x": 0.5,
-      "y": -0.05,
-      "xanchor": "center",
-      "yanchor": "top"
-    },
     "hovermode": "closest",
-    "width": 550,
+    "showlegend": false,
+    "width": 650,
     "height": 550,
-    "margin": {"l": 80, "r": 40, "b": 60, "t": 20, "pad": 0}
+    "margin": {"l": 80, "r": 40, "b": 60, "t": 60, "pad": 0},
+    "annotations": [{
+      "showarrow": false,
+      "text": "date angular axes are <b>not</b> supported yet.",
+      "xref": "paper",
+      "yref": "paper",
+      "x": 0.5,
+      "y": 1.05,
+      "yanchor": "bottom"
+    }]
   }
 }

test/image/mocks/polar_categories.json

@@ -148,6 +148,21 @@ describe('Test polar plots defaults:', function() {
         expect(layoutOut.polar.angularaxis.direction).toBe('clockwise');
         expect(layoutOut.polar.angularaxis.rotation).toBe(90);
     });
+
+    it('(for now) should log message when detecting *date* angular axes and fallback to *linear*', function() {
+        spyOn(Lib, 'log');
+
+        _supply({}, [{
+            type: 'scatterpolar',
+            r: [1, 2],
+            theta: ['2017-01-01', '2018-01-01'],
+            visible: true,
+            subplot: 'polar'
+        }]);
+
+        expect(Lib.log).toHaveBeenCalledWith('Polar plots do not support date angular axes yet.');
+        expect(layoutOut.polar.angularaxis.type).toBe('linear');
+    });
 });
 
 describe('Test relayout on polar subplots:', function() {