@datarailsshared/dr_renderer 1.2.196-dragons → 1.2.197

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@datarailsshared/dr_renderer",
-  "version": "1.2.196-dragons",
+  "version": "1.2.197",
   "description": "DataRails charts and tables renderer",
   "keywords": [
     "datarails",

package/src/highcharts_renderer.js

@@ -1339,12 +1339,15 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
         return chart_series;
     }
 
-    highchartsRenderer.ptCreateWaterfallBreakdownSeries = function (pivotData, additionOptions, opts) {
+    highchartsRenderer.ptCreateWaterfallBreakdownSeries = function (pivotData, onlyNumbers, additionOptions, opts) {
         const colorOptions = opts.breakdown_options.colors;
-        const chart_series = [];
-        const row_n_keys = pivotData.getRowKeys();
-        const col_n_keys = pivotData.getColKeys();
-        const hasBreakdownValues = lodash.get(opts, 'breakdown_options.values.breakdown.length');
+        var chart_series = [],
+            row_n_keys = pivotData.getRowKeys(),
+            col_n_keys = pivotData.getColKeys();
+
+        if (row_n_keys.length === 0) {
+            row_n_keys.push([]);
+        }
 
         let resultObject = {
             data: [],
@@ -1360,46 +1363,56 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
         };
         resultObject = highchartsRenderer.getDataLabelsOptions(additionOptions, resultObject);
 
+        const breakdownValues = [];
         lodash.forEach(col_n_keys, function(col_n_value, col_index) {
+            breakdownValues.push([]);
+            lodash.forEach(row_n_keys, function (row_n_value, row_index) {
+                var agg = pivotData.getAggregator(row_n_value, col_n_value);
+                var val = agg.value();
 
-            const totalColumnValue = pivotData.colTotals[col_n_value].sum;
-            const nextTotalColumnKey = col_n_keys[col_index + 1];
-            const nextTotalColumnValue = nextTotalColumnKey ? pivotData.colTotals[nextTotalColumnKey].sum : null;
-            resultObject.data.push({
-                y: totalColumnValue,
-                name: lodash.unescape(col_n_value).replace('DR_Others', highchartsRenderer.getOthersName(opts)),
-                isSum: !!col_index,
-                isTotal: true,
-                color: colorOptions.total,
-            });
+                if (val != null && $.isNumeric(val)) {
+                    val = parseFloat(val);
+                } else if (onlyNumbers) {
+                    val = NaN;
+                } else {
+                    val = 0;
+                }
 
-            if (col_index !== col_n_keys.length - 1) {
-                lodash.forEach(row_n_keys, function (row_n_value) {
-                    const agg = pivotData.getAggregator(row_n_value, col_n_value);
-                    let val = hasBreakdownValues
-                        ? agg.value()
-                        : nextTotalColumnValue - totalColumnValue;
-
-                    val = $.isNumeric(val) ? parseFloat(val) : 0;
-                    if (val) {
-                        const tmoobj = {};
-                        const key = lodash.isArray(row_n_value) ? row_n_value[0] : row_n_value;
-                        tmoobj.name = lodash.unescape(key);
+                breakdownValues[col_index][row_index] = val;
+
+                if (col_index) {
+                    const value = val - breakdownValues[col_index - 1][row_index];
 
+                    if (value) {
+                        var tmoobj = {};
+                        var key = row_n_value;
+                        if (lodash.isArray(row_n_value)) {
+                            key = row_n_value[0];
+                        }
+                        tmoobj.name = lodash.unescape(key);
+        
                         if (tmoobj.name) {
                             tmoobj.name = tmoobj.name.replace('DR_Others', highchartsRenderer.getOthersName(opts));
                         }
+        
                         if (lodash.isEmpty(String(tmoobj.name))) {
                             tmoobj.name = lodash.unescape(col_n_value);
                             tmoobj.visible = false;
                         }
-
-                        tmoobj.y = val;
+                        tmoobj.y = value;
                         tmoobj.colKeys = [lodash.unescape(col_n_keys[col_index - 1]), lodash.unescape(col_n_value)];
                         resultObject.data.push(tmoobj);
                     }
-                });
-            }
+                }
+            });
+
+            resultObject.data.push({
+                y: pivotData.colTotals[col_n_value].sum,
+                name: lodash.unescape(col_n_value).replace('DR_Others', highchartsRenderer.getOthersName(opts)),
+                isSum: !!col_index,
+                isTotal: true,
+                color: colorOptions.total,
+            });
         });
 
         chart_series.push(resultObject);
@@ -3177,8 +3190,6 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             ? opts.chartOptions
             : highchartsRenderer.getDefaultValueForChart(highchartsRenderer.CHART_TYPES.WATERFALL_BREAKDOWN);
 
-        pivotData.colKeys = lodash.map(lodash.keys(pivotData.colTotals), key => [key]);
-
         chartOptions.chart = {
             type: 'waterfall',
             zoomType: additionOptions && additionOptions.chart && additionOptions.chart.zoom_type ? additionOptions.chart.zoom_type : 'None',
@@ -3229,7 +3240,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             chartOptions.colors = opts.paletteOptions.dashboardPalette.colors;
         }
         chartOptions.series = highchartsRenderer
-            .ptCreateWaterfallBreakdownSeries(pivotData, additionOptions, opts);
+            .ptCreateWaterfallBreakdownSeries(pivotData, null, additionOptions, opts);
 
         chartOptions = highchartsRenderer.prepareAxisX(chartOptions, additionOptions, pivotData.getColKeys());
         chartOptions.plotOptions = {
@@ -3265,10 +3276,6 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             enabled: false
         };
 
-        chartOptions.xAxis.labels = {
-            formatter: highchartsRenderer.getBreakdownXAxisLabelFormatter(chartOptions.series),
-        };
-
         return highchartsRenderer.ptCreateElementAndDraw(chartOptions, opts);
     };
 
@@ -4360,12 +4367,15 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             );
 
             if (uniqueCategories && (uniqueCategories.length > maxCategories || uniqueCategories.length < minCategories )) {
+                const commonErrorSentence = `Please choose ${ minCategories }-${ maxCategories } items in the Category section.`
                 options.error_has_occurred = true;
                 options.error_params = {
-                    title: 'Data Conflict',
-                    text: `Please adjust your dashboard's reference date and filter selections as \
-                        the quantity of data doesn't match the chart's ${ minCategories }-${ maxCategories } value limit.`,
-                    class: 'nodata' ,
+                    title: uniqueCategories.length > maxCategories
+                        ? `There is too much data. ${ commonErrorSentence }`
+                        : `Not enough data. ${ commonErrorSentence }`,
+                    text: '',
+                    btnText: 'Edit Widget',
+                    class: 'too-much-data',
                 }
                 return highchartsRenderer.getNoDataResult(options.rendererOptions, true);
             }
@@ -6784,18 +6794,16 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
 
     highchartsRenderer.chartsTypesInfo = {
         [highchartsRenderer.CHART_TYPES.WATERFALL_BREAKDOWN]: {
-            name: 'Breakdown Chart ',
-            label: 'Breakdown Chart ',
-            title: 'Analyzes what’s contributing to the financial increase or decrease.',
-            description: 'For example, analyzes what’s contributing most to the difference in total revenue between last year and this year.',
+            name: 'Waterfall Breakdown Chart ',
+            label: 'Waterfall Breakdown Chart ',
+            title: 'TODO: add text',
+            description: 'TODO: add text',
             titleInEditor: 'This chart displays the breakdown of variance between two or more total values.',
             axisName: 'Category',
             legendName: 'Breakdown',
             startedMessage: 'To get started, drag one field to the Category and one field to the Value section.',
-            axisTooltipTitle: 'Drag one field to configure your x-axis.',
-            axisTooltipDescription: 'The category (usually an independent variable) is shown on the x-axis and should be between 2 to 5 total columns. ',
-            legendTooltipTitle: 'Drag one field to further configure your x-axis.',
-            legendTooltipDescription: 'The breakdown subdivides the chart by a category field for further analysis of what’s contributing to the increase or decrease.',
+            axisTooltipTitle: 'TODO: add text',
+            legendTooltipTitle: 'TODO: add text',
         }, 
         'combo-chart': {
             name: 'Combo Chart ',
@@ -7432,12 +7440,13 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             {
                 type: 'waterfall-chart',
                 name: 'Waterfall',
-                class: 'google-visualization-charteditor-mini-waterfall',
+                hidden: true,
+                class: 'google-visualization-charteditor-mini-column',
                 subtypes: [
                     {
                         type: highchartsRenderer.CHART_TYPES.WATERFALL_BREAKDOWN,
                         name:  highchartsRenderer.chartsTypesInfo[highchartsRenderer.CHART_TYPES.WATERFALL_BREAKDOWN].name,
-                        class: 'google-visualization-charteditor-thumbs-breakdown',
+                        class: 'google-visualization-charteditor-thumbs-columnchart',
                         render: highchartsRenderer.ptRenderWaterfallBreakdown,
                         suboptions: [
                             highchartsRenderer.suboptions["axisY"],
@@ -8660,19 +8669,11 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             rows = [];
         } else {
             rows = cols;
-            cols = [point.colKeys[1]];
+            cols = [];
         }
         return { rows, cols };
     }
 
-    highchartsRenderer.getBreakdownXAxisLabelFormatter = function(chartSeries) {
-        const styleForBreakdownLabel = 'font-weight: normal; color: #51566f;';
-        return function() {
-            const isTotal = lodash.some(chartSeries[0].data, point => point.name === this.value && point.isTotal);
-            return `<span style="${ isTotal ? '' : styleForBreakdownLabel }">${ this.value }</span>`;
-        }
-    }
-
     return highchartsRenderer;
 };