Add barpolar traces #2954

etpinard · 2018-08-29T19:58:49Z

resolves #2810 (not everything item on there, but enough to replace legacy polar's area trace type)

Say hello to Polar 2.0's version of 'area' traces: barpolar. As discussed previously, this trace type is "really" like a bar chart but in polar coordinates, hence its name. Here's a much-awaited updated version of our wind rose example:

Moreover, barpolar isn't just "really like" bar from a user's standpoint, but also from a dev's standpoint: I was able to reuse almost all of Bar.crossTraceCalc (formally known as Bar.setPositions), its default logic is a mix of ScatterPolar and Bar routines.

The hard part about this PR was to keep everything DRY. Many path-drawing routines in plots/polar.js had to be generalized in order to be used in BarPolar.plot. See commits 4d20388, 95119c4 and facb2f8 for more details.

In brief, this first version of barpolar, includes support for:

barmode stacked and overlay
bar width, offset and base
per-subplot bargap
hovermode: 'closest', selections

But, does not implement:

orientation 'angular'
on-graph text

cc @alexcjohnson @antoinerg

- as now _module.plot doesn't clear the <g.trace> layers on every call, we don't need to call _module.style to render the correct styling

... which is more precise and less confusing (I think)

- add move findIndexOfMin to lib/search.js

... their polygon-equivalent to helpers.js Then, add wrappers on Polar.prototype, to handle is `gridshape: 'linear'` cases.

includes support for: - barmode stacked and overlay - bar width, offset and base - per-subplot bargap does not support: - orientation 'angular' - on-graph text

- w/ reversed radial range - radial category - radial date - radial log

src/traces/barpolar/layout_attributes.js

src/traces/barpolar/plot.js

src/plots/polar/polar.js

src/lib/angles.js

src/lib/index.js

src/plots/polar/polar.js

src/lib/angles.js

src/traces/barpolar/attributes.js

src/traces/barpolar/plot.js

src/traces/barpolar/hover.js

test/image/mocks/polar_funky-bars.json

test/jasmine/tests/barpolar_test.js

alexcjohnson · 2018-08-31T03:23:03Z

Fantastic job @etpinard - look and feel is beautiful, you've got more than enough here for a v1. Just a few comments above and we'll be ready to go!

... which is an improvement over commit 8ca4101

- always use angles in radians in angles.js and polar/helpers.js - adapt polar/helpers.js call signatures to match the ones in angles.js

... which won't be attempted in the first version of barpolar

etpinard · 2018-09-04T21:58:25Z

test/image/mocks/polar_bar-overlay.json

+    "theta": [0, 45],
+    "opacity": 0.7,
+    "marker": {
+      "line": {"width": 5}


which looks like

closeup

with the default stroke-mitelimit.

- so that bar and barpolar can DRY up their plot logic - need to rename histogram "hover positions" p0/p1 -> ph0/ph1

@alexcjohnson

- thanks @alexcjohnson for the tip!

etpinard · 2018-09-05T16:02:04Z

src/traces/histogram/calc.js

            if(!cumulativeSpec.enabled) {
                cdi.pts = inputPoints[i];
                if(uniqueValsPerBin) {
-                    cdi.p0 = cdi.p1 = (inputPoints[i].length) ? pos0[inputPoints[i][0]] : pos[i];
+                    cdi.ph0 = cdi.ph1 = (inputPoints[i].length) ? pos0[inputPoints[i][0]] : pos[i];


ping @alexcjohnson I hope you don't mind.

The bar corners p0/p1/s0/s1 are now set during Bar.crossTraceCalc (moved from Bar.plot) so that we don't have to duplicate logic in BarPolar.plot. In turn, we needed to rename histogram p0/p1 to not break histogram hover.

src/lib/mod.js

src/lib/angles.js

- and use it in Lib.angleDelta

alexcjohnson · 2018-09-05T23:33:51Z

Very nice 💃

etpinard added 17 commits August 23, 2018 13:23

expose setGroupPositions from bar/set_positions.js

347979c

don't set undefined class names via Lib.ensureSingle

8ca4101

🔪 now useless _module.style loop

52ed444

- as now _module.plot doesn't clear the <g.trace> layers on every call, we don't need to call _module.style to render the correct styling

DRY up polar mock cartesian axis 'range' logic

d35d13b

rename Polar.prototype.isPtWithinSector -> isPtInside

eb9307e

... which is more precise and less confusing (I think)

move a few things to lib/angles.js + add isPtInsideSector

4d20388

move polar polygon logic to polar/helper.js

95119c4

- add move findIndexOfMin to lib/search.js

mv arc/sector/annular path fn to angles.js

facb2f8

... their polygon-equivalent to helpers.js Then, add wrappers on Polar.prototype, to handle is `gridshape: 'linear'` cases.

update polar baselines post pathSector/pathArc cleanup

5ea3d52

add barpolar 🎉

a328b1a

includes support for: - barmode stacked and overlay - bar width, offset and base - per-subplot bargap does not support: - orientation 'angular' - on-graph text

fix 'date' radial polar axes

dcdd6b5

🔒 barpolar on funky subplots

6edd45e

- w/ reversed radial range - radial category - radial date - radial log

bullet-proof barpolar hover

7ae3b7c

add barpolar mock to svg mock list

0f62c0f

add barpolar hover tests

235b425

add barpolar select test

6b5895f

fixup jsDoc header

296f088

etpinard added bug something broken feature something new status: reviewable labels Aug 29, 2018

etpinard added this to the v1.41.0 milestone Aug 29, 2018