fix #9

RhoInc · Jun 24, 2019 · e8fe1ad · e8fe1ad
1 parent 663bf13
commit e8fe1ad
Show file tree

Hide file tree

Showing 10 changed files with 189 additions and 38 deletions.
diff --git a/dashboardCharts.js b/dashboardCharts.js
@@ -262,7 +262,7 @@
         var variables = Object.keys(this.raw_data[0]);
 
         //Define ordered status set.
-        this.status_set = d3
+        var status_set = d3
             .set(
                 this.raw_data.map(function(d) {
                     return (
@@ -298,12 +298,12 @@
 
         //Update color domain.
         if (!(Array.isArray(this.config.color_dom) && this.config.color_dom.length))
-            this.config.color_dom = this.status_set.map(function(status) {
+            this.config.color_dom = status_set.map(function(status) {
                 return status.split(':|:')[0];
             });
         else
             this.config.color_dom = this.config.color_dom.concat(
-                this.status_set
+                status_set
                     .map(function(status) {
                         return status.split(':|:')[0];
                     })
@@ -314,25 +314,33 @@
 
         //Update colors.
         if (variables.indexOf(status_color_col) > -1)
-            this.config.colors = this.status_set.map(function(status) {
+            this.config.colors = status_set.map(function(status) {
                 return status.split(':|:')[2];
             });
 
         //Update legend order.
         if (!(Array.isArray(this.config.legend.order) && this.config.legend.order.length))
-            this.config.legend.order = this.status_set.map(function(status) {
+            this.config.legend.order = status_set.map(function(status) {
                 return status.split(':|:')[0];
             });
         else
             this.config.legend.order = this.config.legend.order.concat(
-                this.status_set
+                status_set
                     .map(function(status) {
                         return status.split(':|:')[0];
                     })
                     .filter(function(status) {
                         return _this.config.legend.order.indexOf(status) < 0;
                     })
             );
+
+        //Order raw data so stacked bars are ordered correctly.
+        this.raw_data.sort(function(a, b) {
+            return (
+                _this.config.legend.order.indexOf(a[_this.config.status_col]) -
+                _this.config.legend.order.indexOf(b[_this.config.status_col])
+            );
+        });
     }
 
     function onInit() {
@@ -565,7 +573,95 @@
         syncControlInputs: syncControlInputs$1
     };
 
+    var slicedToArray = (function() {
+        function sliceIterator(arr, i) {
+            var _arr = [];
+            var _n = true;
+            var _d = false;
+            var _e = undefined;
+
+            try {
+                for (
+                    var _i = arr[Symbol.iterator](), _s;
+                    !(_n = (_s = _i.next()).done);
+                    _n = true
+                ) {
+                    _arr.push(_s.value);
+
+                    if (i && _arr.length === i) break;
+                }
+            } catch (err) {
+                _d = true;
+                _e = err;
+            } finally {
+                try {
+                    if (!_n && _i['return']) _i['return']();
+                } finally {
+                    if (_d) throw _e;
+                }
+            }
+
+            return _arr;
+        }
+
+        return function(arr, i) {
+            if (Array.isArray(arr)) {
+                return arr;
+            } else if (Symbol.iterator in Object(arr)) {
+                return sliceIterator(arr, i);
+            } else {
+                throw new TypeError('Invalid attempt to destructure non-iterable instance');
+            }
+        };
+    })();
+
+    function defineOrder(data, value_col, order_col) {
+        //Define set of values.
+        var values = d3
+            .set(
+                data.map(function(d) {
+                    return d[value_col] + ':|:' + d[order_col];
+                })
+            )
+            .values();
+
+        //Order values.
+        var orderedValues = values
+            .map(function(value_order) {
+                var _value_order$split = value_order.split(':|:'),
+                    _value_order$split2 = slicedToArray(_value_order$split, 2),
+                    value = _value_order$split2[0],
+                    order = _value_order$split2[1];
+
+                return {
+                    value: value,
+                    order: order,
+                    float: parseFloat(order)
+                };
+            })
+            .sort(function(a, b) {
+                return !isNaN(a.float) && !isNaN(b.float) // numerical comparison
+                    ? a.float - b.float
+                    : a.order < b.order // alphanumeric ordering - left-side order is smaller
+                        ? -1
+                        : b.order < a.order // alphanumeric ordering - right-side order is smaller
+                            ? 1
+                            : a.value < b.value // equal left- and right-side order - left-side value is smaller
+                                ? -1
+                                : 1; // equal left- and right-side order - right-side value is smaller
+            });
+
+        return orderedValues;
+    }
+
     function onInit$1() {
+        this.config.x.order = defineOrder(
+            this.raw_data,
+            this.config.visit_col,
+            this.config.visit_order_col
+        ).map(function(element) {
+            return element.value;
+        });
         defineStatusSet.call(
             this,
             this.config.status_col,
@@ -580,11 +676,21 @@
 
     function onDatatransform$1() {}
 
+    function setYFormat() {
+        switch (this.config.marks[0].summarizeY) {
+            case 'count':
+                this.config.y.format = '1d';
+                break;
+            case 'percent':
+                this.config.y.format = '%';
+                break;
+            default:
+                this.config.y.format = null;
+        }
+    }
+
     function onDraw$1() {
-        var summarizeY = this.config.marks[0].summarizeY;
-        if (summarizeY === 'count') this.config.y.format = '1d';
-        else if (summarizeY === 'percent') this.config.y.format = '%';
-        else this.config.y.format = null;
+        setYFormat.call(this);
     }
 
     function onResize$1() {
@@ -726,10 +832,7 @@
     function onDatatransform$2() {}
 
     function onDraw$2() {
-        var summarizeY = this.config.marks[0].summarizeY;
-        if (summarizeY === 'count') this.config.y.format = '1d';
-        else if (summarizeY === 'percent') this.config.y.format = '%';
-        else this.config.y.format = null;
+        setYFormat.call(this);
     }
 
     function onResize$2() {
@@ -1100,10 +1203,7 @@
     function onDatatransform$4() {}
 
     function onDraw$4() {
-        var summarizeY = this.config.marks[0].summarizeY;
-        if (summarizeY === 'count') this.config.y.format = '1d';
-        else if (summarizeY === 'percent') this.config.y.format = '%';
-        else this.config.y.format = null;
+        setYFormat.call(this);
     }
 
     function onResize$4() {

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "dashboard-charts",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "Clinical Dashboards",
   "module": "./src/index.js",
   "main": "./dashboardCharts.js",

diff --git a/src/forms/callbacks/onDraw.js b/src/forms/callbacks/onDraw.js
@@ -1,6 +1,5 @@
+import setYFormat from '../../util/setYFormat';
+
 export default function onDraw() {
-    const summarizeY = this.config.marks[0].summarizeY;
-    if (summarizeY === 'count') this.config.y.format = '1d';
-    else if (summarizeY === 'percent') this.config.y.format = '%';
-    else this.config.y.format = null;
+    setYFormat.call(this);
 }
diff --git a/src/queries/callbacks/onDraw.js b/src/queries/callbacks/onDraw.js
@@ -1,6 +1,5 @@
+import setYFormat from '../../util/setYFormat';
+
 export default function onDraw() {
-    const summarizeY = this.config.marks[0].summarizeY;
-    if (summarizeY === 'count') this.config.y.format = '1d';
-    else if (summarizeY === 'percent') this.config.y.format = '%';
-    else this.config.y.format = null;
+    setYFormat.call(this);
 }
diff --git a/src/util/defineOrder.js b/src/util/defineOrder.js
@@ -0,0 +1,29 @@
+export default function defineOrder(data, value_col, order_col) {
+    //Define set of values.
+    const values = d3.set(data.map(d => `${d[value_col]}:|:${d[order_col]}`)).values();
+
+    //Order values.
+    const orderedValues = values
+        .map(value_order => {
+            const [value, order] = value_order.split(':|:');
+            return {
+                value,
+                order,
+                float: parseFloat(order)
+            };
+        })
+        .sort(
+            (a, b) =>
+                !isNaN(a.float) && !isNaN(b.float) // numerical comparison
+                    ? a.float - b.float
+                    : a.order < b.order // alphanumeric ordering - left-side order is smaller
+                        ? -1
+                        : b.order < a.order // alphanumeric ordering - right-side order is smaller
+                            ? 1
+                            : a.value < b.value // equal left- and right-side order - left-side value is smaller
+                                ? -1
+                                : 1 // equal left- and right-side order - right-side value is smaller
+        );
+
+    return orderedValues;
+}
diff --git a/src/util/defineStatusSet.js b/src/util/defineStatusSet.js
@@ -2,7 +2,7 @@ export default function defineStatusSet(status_col, status_order_col, status_col
     const variables = Object.keys(this.raw_data[0]);
 
     //Define ordered status set.
-    this.status_set = d3
+    const status_set = d3
         .set(
             this.raw_data.map(
                 d => `${d[status_col]}:|:${d[status_order_col]}:|:${d[status_color_col]}`
@@ -36,25 +36,32 @@ export default function defineStatusSet(status_col, status_order_col, status_col
 
     //Update color domain.
     if (!(Array.isArray(this.config.color_dom) && this.config.color_dom.length))
-        this.config.color_dom = this.status_set.map(status => status.split(':|:')[0]);
+        this.config.color_dom = status_set.map(status => status.split(':|:')[0]);
     else
         this.config.color_dom = this.config.color_dom.concat(
-            this.status_set
+            status_set
                 .map(status => status.split(':|:')[0])
                 .filter(status => this.config.color_dom.indexOf(status) < 0)
         );
 
     //Update colors.
     if (variables.indexOf(status_color_col) > -1)
-        this.config.colors = this.status_set.map(status => status.split(':|:')[2]);
+        this.config.colors = status_set.map(status => status.split(':|:')[2]);
 
     //Update legend order.
     if (!(Array.isArray(this.config.legend.order) && this.config.legend.order.length))
-        this.config.legend.order = this.status_set.map(status => status.split(':|:')[0]);
+        this.config.legend.order = status_set.map(status => status.split(':|:')[0]);
     else
         this.config.legend.order = this.config.legend.order.concat(
-            this.status_set
+            status_set
                 .map(status => status.split(':|:')[0])
                 .filter(status => this.config.legend.order.indexOf(status) < 0)
         );
+
+    //Order raw data so stacked bars are ordered correctly.
+    this.raw_data.sort(
+        (a, b) =>
+            this.config.legend.order.indexOf(a[this.config.status_col]) -
+            this.config.legend.order.indexOf(b[this.config.status_col])
+    );
 }
diff --git a/src/util/setYFormat.js b/src/util/setYFormat.js
@@ -0,0 +1,12 @@
+export default function setYFormat() {
+    switch (this.config.marks[0].summarizeY) {
+        case 'count':
+            this.config.y.format = '1d';
+            break;
+        case 'percent':
+            this.config.y.format = '%';
+            break;
+        default:
+            this.config.y.format = null;
+    }
+}
diff --git a/src/visitCompletion/callbacks/onDraw.js b/src/visitCompletion/callbacks/onDraw.js
@@ -1,6 +1,5 @@
+import setYFormat from '../../util/setYFormat';
+
 export default function onDraw() {
-    const summarizeY = this.config.marks[0].summarizeY;
-    if (summarizeY === 'count') this.config.y.format = '1d';
-    else if (summarizeY === 'percent') this.config.y.format = '%';
-    else this.config.y.format = null;
+    setYFormat.call(this);
 }
diff --git a/src/visitCompletion/callbacks/onInit.js b/src/visitCompletion/callbacks/onInit.js
@@ -1,6 +1,12 @@
+import defineOrder from '../../util/defineOrder';
 import defineStatusSet from '../../util/defineStatusSet';
 
 export default function onInit() {
+    this.config.x.order = defineOrder(
+        this.raw_data,
+        this.config.visit_col,
+        this.config.visit_order_col
+    ).map(element => element.value);
     defineStatusSet.call(
         this,
         this.config.status_col,