working prototype with triagles showing direction of increases and decreases and rectangles displaying the intermediate and total sum

archmoj · archmoj · commit abc99d0611ea · 2019-02-01T12:48:31.000-05:00
diff --git a/src/traces/bar/calc.js b/src/traces/bar/calc.js
@@ -14,10 +14,19 @@ var colorscaleCalc = require('../../components/colorscale/calc');
 var arraysToCalcdata = require('./arrays_to_calcdata');
 var calcSelection = require('../scatter/calc_selection');
 
+function includes(list, item) {
+    for(var i = 0; i < list.length; i++) {
+        if(list[i] === item) return true;
+    }
+    return false;
+}
+
 module.exports = function calc(gd, trace) {
     var xa = Axes.getFromId(gd, trace.xaxis || 'x');
     var ya = Axes.getFromId(gd, trace.yaxis || 'y');
-    var size, pos;
+    var size, pos, i;
+
+    var isWaterfall = trace.type === 'waterfall';
 
     if(trace.orientation === 'h') {
         size = xa.makeCalcdata(trace, 'x');
@@ -32,13 +41,13 @@ module.exports = function calc(gd, trace) {
     var cd = new Array(serieslen);
 
     // set position and size (as well as for waterfall total size)
-    for(var i = 0; i < serieslen; i++) {
+    for(i = 0; i < serieslen; i++) {
         cd[i] = {
             p: pos[i],
             s: size[i]
         };
 
-        if(trace.type === 'waterfall') {
+        if(isWaterfall) {
             cd[i].sum = (i === 0) ? 0 : cd[i - 1].sum + cd[i - 1].s;
         }
 
@@ -47,6 +56,32 @@ module.exports = function calc(gd, trace) {
         }
     }
 
+    if(isWaterfall) {
+        var newCD = [];
+        var n = 0;
+        for(i = 0; i < serieslen; i++) {
+            newCD[n] = {
+                p: cd[i].p,
+                s: cd[i].s,
+                sum: cd[i].sum,
+                isReport: false
+            }; n++;
+
+            if(includes(trace.report.after, i)) {
+                // console.log("Found at: ", i);
+                newCD[n] = {
+                    p: cd[i].p + 0.5,
+                    s: cd[i].s,
+                    sum: cd[i].sum,
+                    isReport: true
+                }; n++;
+            }
+        }
+        // console.log("newCD=", newCD);
+
+        cd = newCD;
+    }
+
     // auto-z and autocolorscale if applicable
     if(hasColorscale(trace, 'marker')) {
         colorscaleCalc(gd, trace, {
diff --git a/src/traces/bar/cross_trace_calc.js b/src/traces/bar/cross_trace_calc.js
@@ -152,7 +152,11 @@ function initBase(gd, pa, sa, calcTraces) {
 
         if(trace.type === 'waterfall') {
             for(j = 0; j < cd.length; j++) {
-                cd[j].b += cd[j].sum;
+                if(cd[j].isReport === true) {
+                    cd[j].s += cd[j].sum;
+                } else {
+                    cd[j].b += cd[j].sum;
+                }
             }
         }
     }
diff --git a/src/traces/bar/plot.js b/src/traces/bar/plot.js
@@ -38,6 +38,8 @@ module.exports = function plot(gd, plotinfo, cdbar, barLayer) {
         var cd0 = cd[0];
         var trace = cd0.trace;
 
+        var isWaterfall = trace.type === 'waterfall';
+
         if(!plotinfo.isRangePlot) cd0.node3 = plotGroup;
 
         var pointGroup = Lib.ensureSingle(plotGroup, 'g', 'points');
@@ -119,11 +121,18 @@ module.exports = function plot(gd, plotinfo, cdbar, barLayer) {
                 y1 = fixpx(y1, y0);
             }
 
+            var shape;
+
+            if(isWaterfall && cd[i].isReport === false) {
+                shape = 'M' + x0 + ',' + y0 + 'L' + (0.5 * (x1 + x0)) + ',' + y1 + 'V' + y0 + 'Z';
+            } else {
+                shape = 'M' + x0 + ',' + y0 + 'V' + y1 + 'H' + x1 + 'V' + y0 + 'Z';
+            }
+
             Lib.ensureSingle(bar, 'path')
-                .style('vector-effect', 'non-scaling-stroke')
-                .attr('d',
-                    'M' + x0 + ',' + y0 + 'V' + y1 + 'H' + x1 + 'V' + y0 + 'Z')
-                .call(Drawing.setClipUrl, plotinfo.layerClipId, gd);
+            .style('vector-effect', 'non-scaling-stroke')
+            .attr('d', shape)
+            .call(Drawing.setClipUrl, plotinfo.layerClipId, gd);
 
             appendBarText(gd, bar, cd, i, x0, x1, y0, y1);
 
diff --git a/test/image/mocks/waterfall_display-positive-negative-contributions.json b/test/image/mocks/waterfall_display-positive-negative-contributions.json
@@ -18,7 +18,7 @@
         "name": "first",
         "type": "waterfall",
         "report" : {
-          "after": [2, 5],
+          "after": [1, 4],
           "label": ["intermediate sum", "total"]
         },
         "orientation": "v"
@@ -41,7 +41,7 @@
         "name": "second",
         "type": "waterfall",
         "report" : {
-          "after": [2, 5],
+          "after": [1, 2, 4],
           "label": ["intermediate sum", "total"]
         },
         "orientation": "v"

Original file line number	Diff line number	Diff line change
`@@ -152,7 +152,11 @@ function initBase(gd, pa, sa, calcTraces) {`
`152`	`152`
`153`	`153`	`if(trace.type === 'waterfall') {`
`154`	`154`	`for(j = 0; j < cd.length; j++) {`
`155`		`- cd[j].b += cd[j].sum;`
	`155`	`+ if(cd[j].isReport === true) {`
	`156`	`+ cd[j].s += cd[j].sum;`
	`157`	`+ } else {`
	`158`	`+ cd[j].b += cd[j].sum;`
	`159`	`+ }`
`156`	`160`	`}`
`157`	`161`	`}`
`158`	`162`	`}`