Add barpolar traces

lib/barpolar.js

@@ -0,0 +1,11 @@
+/**
+* Copyright 2012-2018, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+'use strict';
+
+module.exports = require('../src/traces/barpolar');

lib/index.js

@@ -53,7 +53,8 @@ Plotly.register([
     require('./candlestick'),
 
     require('./scatterpolar'),
-    require('./scatterpolargl')
+    require('./scatterpolargl'),
+    require('./barpolar')
 ]);
 
 // transforms

src/plots/plots.js

@@ -2602,7 +2602,7 @@ function doCrossTraceCalc(gd) {
                     fullLayout[sp];
 
                 for(j = 0; j < methods.length; j++) {
-                    methods[j](gd, spInfo);
+                    methods[j](gd, spInfo, sp);
                 }
             }
         }

src/plots/polar/helpers.js

@@ -13,6 +13,7 @@ var polygonTester = require('../../lib/polygon').tester;
 
 var findIndexOfMin = Lib.findIndexOfMin;
 var isAngleInsideSector = Lib.isAngleInsideSector;
+var angleDelta = Lib.angleDelta;
 var angleDist = Lib.angleDist;
 var deg2rad = Lib.deg2rad;
 
@@ -198,6 +199,22 @@ function findPolygonOffset(r, sector, vangles) {
     return [minX, minY];
 }
 
+/* find vertex angles (in 'vangles') the enclose angle 'a'
+ *
+ * @param {number} a : angle in *radians*
+ * @param {array} vangles : angles of polygon vertices in *radians*
+ * @return {2-item array}
+ */
+function findEnclosingVertexAngles(a, vangles) {
+    var minFn = function(v) {
+        var adelta = angleDelta(v, a);
+        return adelta > 0 ? adelta : Infinity;
+    };
+    var i0 = findIndexOfMin(vangles, minFn);
+    var i1 = Lib.mod(i0 + 1, vangles.length);
+    return [vangles[i0], vangles[i1]];
+}
+
 // to more easily catch 'almost zero' numbers in if-else blocks
 function clampTiny(v) {
     return Math.abs(v) > 1e-10 ? v : 0;
@@ -265,6 +282,7 @@ function pathPolygonAnnulus(r0, r1, sector, vangles, cx, cy) {
 module.exports = {
     isPtInsidePolygon: isPtInsidePolygon,
     findPolygonOffset: findPolygonOffset,
+    findEnclosingVertexAngles: findEnclosingVertexAngles,
     findIntersectionXY: findIntersectionXY,
     findXYatLength: findXYatLength,
     clampTiny: clampTiny,

src/plots/polar/polar.js

@@ -128,6 +128,8 @@ proto.updateLayers = function(fullLayout, polarLayout) {
             switch(d) {
                 case 'frontplot':
                     sel.append('g').classed('scatterlayer', true);
+                    // TODO add option to place in 'backplot' layer??
+                    sel.append('g').classed('barlayer', true);
                     break;
                 case 'backplot':
                     sel.append('g').classed('maplayer', true);
@@ -617,6 +619,7 @@ proto.updateMainDrag = function(fullLayout, polarLayout) {
     var vangles = _this.vangles;
     var clampTiny = helpers.clampTiny;
     var findXYatLength = helpers.findXYatLength;
+    var findEnclosingVertexAngles = helpers.findEnclosingVertexAngles;
     var chw = constants.cornerHalfWidth;
     var chl = constants.cornerLen / 2;
 
@@ -790,15 +793,6 @@ proto.updateMainDrag = function(fullLayout, polarLayout) {
         applyZoomMove(path1, cpath);
     }
 
-    function findEnclosingVertexAngles(a) {
-        var i0 = Lib.findIndexOfMin(vangles, function(v) {
-            var adelta = Lib.angleDelta(v, a);
-            return adelta > 0 ? adelta : Infinity;
-        });
-        var i1 = Lib.mod(i0 + 1, vangles.length);
-        return [vangles[i0], vangles[i1]];
-    }
-
     function findPolygonRadius(x, y, va0, va1) {
         var xy = helpers.findIntersectionXY(va0, va1, va0, [x - cxx, cyy - y]);
         return norm(xy[0], xy[1]);
@@ -809,8 +803,8 @@ proto.updateMainDrag = function(fullLayout, polarLayout) {
         var y1 = y0 + dy;
         var a0 = xy2a(x0, y0);
         var a1 = xy2a(x1, y1);
-        var vangles0 = findEnclosingVertexAngles(a0);
-        var vangles1 = findEnclosingVertexAngles(a1);
+        var vangles0 = findEnclosingVertexAngles(a0, vangles);
+        var vangles1 = findEnclosingVertexAngles(a1, vangles);
         var rr0 = findPolygonRadius(x0, y0, vangles0[0], vangles0[1]);
         var rr1 = Math.min(findPolygonRadius(x1, y1, vangles1[0], vangles1[1]), radius);
         var path1;

src/plots/polar/set_convert.js

@@ -53,15 +53,15 @@ module.exports = function setConvert(ax, polarLayout, fullLayout) {
     switch(ax._id) {
         case 'x':
         case 'radialaxis':
-            setConvertRadial(ax);
+            setConvertRadial(ax, polarLayout);
             break;
         case 'angularaxis':
             setConvertAngular(ax, polarLayout);
             break;
     }
 };
 
-function setConvertRadial(ax) {
+function setConvertRadial(ax, polarLayout) {
     ax.setGeometry = function() {
         var rng = ax.range;
 
@@ -77,6 +77,13 @@ function setConvertRadial(ax) {
         ax.g2c = function(v) {
             return ax.r2c(v + rng[0]);
         };
+
+        // TODO might need to r2l these range values?
+        var m = polarLayout._subplot.radius / (rng[1] - rng[0]);
+
+        ax.g2p = function(v) { return v * m; };
+
+        ax.c2p = function(v) { return ax.g2p(ax.c2g(v)); };
     };
 }
 

src/traces/bar/cross_trace_calc.js

@@ -247,7 +247,7 @@ function setGroupPositionsInStackOrRelativeMode(gd, pa, sa, calcTraces) {
 function setOffsetAndWidth(gd, pa, sieve) {
     var fullLayout = gd._fullLayout,
         bargap = fullLayout.bargap,
-        bargroupgap = fullLayout.bargroupgap,
+        bargroupgap = fullLayout.bargroupgap || 0,
         minDiff = sieve.minDiff,
         calcTraces = sieve.traces,
         i, calcTrace, calcTrace0,
@@ -290,7 +290,7 @@ function setOffsetAndWidth(gd, pa, sieve) {
 function setOffsetAndWidthInGroupMode(gd, pa, sieve) {
     var fullLayout = gd._fullLayout,
         bargap = fullLayout.bargap,
-        bargroupgap = fullLayout.bargroupgap,
+        bargroupgap = fullLayout.bargroupgap || 0,
         positions = sieve.positions,
         distinctPositions = sieve.distinctPositions,
         minDiff = sieve.minDiff,
@@ -350,7 +350,7 @@ function applyAttributes(sieve) {
         fullTrace = calcTrace0.trace;
         t = calcTrace0.t;
 
-        var offset = fullTrace.offset,
+        var offset = fullTrace._offset || fullTrace.offset,
             initialPoffset = t.poffset,
             newPoffset;
 
@@ -377,7 +377,7 @@ function applyAttributes(sieve) {
             t.poffset = offset;
         }
 
-        var width = fullTrace.width,
+        var width = fullTrace._width || fullTrace.width,
             initialBarwidth = t.barwidth;
 
         if(isArrayOrTypedArray(width)) {

src/traces/barpolar/attributes.js

@@ -0,0 +1,54 @@
+/**
+* Copyright 2012-2018, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+'use strict';
+
+var scatterPolarAttrs = require('../scatterpolar/attributes');
+var barAttrs = require('../bar/attributes');
+
+module.exports = {
+    r: scatterPolarAttrs.r,
+    theta: scatterPolarAttrs.theta,
+    r0: scatterPolarAttrs.r0,
+    dr: scatterPolarAttrs.dr,
+    theta0: scatterPolarAttrs.theta0,
+    dtheta: scatterPolarAttrs.dtheta,
+    thetaunit: scatterPolarAttrs.thetaunit,
+
+    // orientation: {
+    //     valType: 'enumerated',
+    //     role: 'info',
+    //     values: ['radial', 'angular'],
+    //     editType: 'calc+clearAxisTypes',
+    //     description: 'Sets the orientation of the bars.'
+    // },
+
+    base: barAttrs.base,
+    offset: barAttrs.offset,
+    width: barAttrs.width,
+
+    text: barAttrs.text,
+    // hovertext: barAttrs.hovertext,
+
+    // textposition: {},
+    // textfont: {},
+    // insidetextfont: {},
+    // outsidetextfont: {},
+    // constraintext: {},
+    // cliponaxis: extendFlat({}, barAttrs.cliponaxis, {dflt: false}),
+
+    marker: barAttrs.marker,
+
+    hoverinfo: scatterPolarAttrs.hoverinfo,
+
+    selected: barAttrs.selected,
+    unselected: barAttrs.unselected
+
+    // error_x (error_r, error_theta)
+    // error_y
+};

src/traces/barpolar/calc.js

@@ -0,0 +1,101 @@
+/**
+* Copyright 2012-2018, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+'use strict';
+
+var hasColorscale = require('../../components/colorscale/has_colorscale');
+var colorscaleCalc = require('../../components/colorscale/calc');
+var arraysToCalcdata = require('../bar/arrays_to_calcdata');
+var setGroupPositions = require('../bar/cross_trace_calc').setGroupPositions;
+var calcSelection = require('../scatter/calc_selection');
+var traceIs = require('../../registry').traceIs;
+var extendFlat = require('../../lib').extendFlat;
+
+function calc(gd, trace) {
+    var fullLayout = gd._fullLayout;
+    var subplotId = trace.subplot;
+    var radialAxis = fullLayout[subplotId].radialaxis;
+    var angularAxis = fullLayout[subplotId].angularaxis;
+    var rArray = radialAxis.makeCalcdata(trace, 'r');
+    var thetaArray = angularAxis.makeCalcdata(trace, 'theta');
+    var len = trace._length;
+    var cd = new Array(len);
+
+    // 'size' axis variables
+    var sArray = rArray;
+    // 'pos' axis variables
+    var pArray = thetaArray;
+
+    for(var i = 0; i < len; i++) {
+        cd[i] = {p: pArray[i], s: sArray[i]};
+    }
+
+    // convert width and offset in 'c' coordinate,
+    // set 'c' value(s) in trace._width and trace._offset,
+    // to make Bar.crossTraceCalc "just work"
+    function d2c(attr) {
+        var val = trace[attr];
+        if(val !== undefined) {
+            trace['_' + attr] = Array.isArray(val) ?
+                angularAxis.makeCalcdata(trace, attr) :
+                angularAxis.d2c(val, trace.thetaunit);
+        }
+    }
+
+    if(angularAxis.type === 'linear') {
+        d2c('width');
+        d2c('offset');
+    }
+
+    if(hasColorscale(trace, 'marker')) {
+        colorscaleCalc(trace, trace.marker.color, 'marker', 'c');
+    }
+    if(hasColorscale(trace, 'marker.line')) {
+        colorscaleCalc(trace, trace.marker.line.color, 'marker.line', 'c');
+    }
+
+    arraysToCalcdata(cd, trace);
+    calcSelection(cd, trace);
+
+    return cd;
+}
+
+function crossTraceCalc(gd, polarLayout, subplotId) {
+    var calcdata = gd.calcdata;
+    var barPolarCd = [];
+
+    for(var i = 0; i < calcdata.length; i++) {
+        var cdi = calcdata[i];
+        var trace = cdi[0].trace;
+
+        if(trace.visible === true && traceIs(trace, 'bar') &&
+            trace.subplot === subplotId
+        ) {
+            barPolarCd.push(cdi);
+        }
+    }
+
+    // to make _extremes is filled in correctly so that
+    // polar._subplot.radialAxis can get auotrange'd
+    // TODO clean up!
+    // I think we want to call getAutorange on polar.radialaxis
+    // NOT on polar._subplot.radialAxis
+    var rAxis = extendFlat({}, polarLayout.radialaxis, {_id: 'x'});
+    var aAxis = polarLayout.angularaxis;
+
+    // 'bargap', 'barmode' are in _fullLayout.polar
+    // TODO clean up setGroupPositions API instead
+    var mockGd = {_fullLayout: polarLayout};
+
+    setGroupPositions(mockGd, aAxis, rAxis, barPolarCd);
+}
+
+module.exports = {
+    calc: calc,
+    crossTraceCalc: crossTraceCalc
+};

src/traces/barpolar/defaults.js

@@ -0,0 +1,56 @@
+/**
+* Copyright 2012-2018, Plotly, Inc.
+* All rights reserved.
+*
+* This source code is licensed under the MIT license found in the
+* LICENSE file in the root directory of this source tree.
+*/
+
+'use strict';
+
+var Lib = require('../../lib');
+
+var handleRThetaDefaults = require('../scatterpolar/defaults').handleRThetaDefaults;
+var handleStyleDefaults = require('../bar/style_defaults');
+var attributes = require('./attributes');
+
+module.exports = function supplyDefaults(traceIn, traceOut, defaultColor, layout) {
+    function coerce(attr, dflt) {
+        return Lib.coerce(traceIn, traceOut, attributes, attr, dflt);
+    }
+
+    var len = handleRThetaDefaults(traceIn, traceOut, layout, coerce);
+    if(!len) {
+        traceOut.visible = false;
+        return;
+    }
+
+    // coerce('orientation', (traceOut.theta && !traceOut.r) ? 'angular' : 'radial');
+
+    coerce('thetaunit');
+    coerce('base');
+    coerce('offset');
+    coerce('width');
+
+    coerce('text');
+    // coerce('hovertext');
+
+    // var textPosition = coerce('textposition');
+    // var hasBoth = Array.isArray(textPosition) || textPosition === 'auto';
+    // var hasInside = hasBoth || textPosition === 'inside';
+    // var hasOutside = hasBoth || textPosition === 'outside';
+
+    // if(hasInside || hasOutside) {
+    //     var textFont = coerceFont(coerce, 'textfont', layout.font);
+    //     if(hasInside) coerceFont(coerce, 'insidetextfont', textFont);
+    //     if(hasOutside) coerceFont(coerce, 'outsidetextfont', textFont);
+    //     coerce('constraintext');
+    //     coerce('selected.textfont.color');
+    //     coerce('unselected.textfont.color');
+    //     coerce('cliponaxis');
+    // }
+
+    handleStyleDefaults(traceIn, traceOut, coerce, defaultColor, layout);
+
+    Lib.coerceSelectionMarkerOpacity(traceOut, coerce);
+};