@datarailsshared/dr_renderer 1.3.38 → 1.3.39

package/package.json

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

package/src/dr-renderer-helpers.js

@@ -62,6 +62,10 @@ function disableLegendInteractionIfRequired(chartOptions, additionOptions) {
     _.set(chartOptions, 'legend.itemStyle.cursor', 'default');
 }
 
+function isShowingEmptyValues(additionOptions) {
+    return !additionOptions || !additionOptions.chart || additionOptions.chart.dislay_empty_values !== false;
+}
+
 module.exports = {
     backendSortingKeysAreNotEmpty,
     capitalize,
@@ -70,4 +74,5 @@ module.exports = {
     mergeDeep,
     removeSVGTextCorrection,
     disableLegendInteractionIfRequired,
+    isShowingEmptyValues,
 }

package/src/highcharts_renderer.js

@@ -1266,6 +1266,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     .replace(highchartsRenderer.DR_OTHERS_KEY, othersName);
                 ob.name = highchartsRenderer.getFormattedRowKey(ob.initialName, pivotData);
             }
+
             lodash.forEach(col_n_keys, function (col_n_value, index) {
                 var agg = pivotData.getAggregator(row_n_value, col_n_value);
                 var val = agg.value();
@@ -1276,13 +1277,8 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                 if (val != null) {
                     if ($.isNumeric(val)) {
                         val = parseFloat(val);
-                        // if (val > -1 && val < 1) {
-                        //     val = parseFloat(val.toPrecision(4));
-                        // } else {
-                        //     val = parseFloat(val.toFixed(2));
-                        // }
                     }
-                } else {
+                } else if (helpers.isShowingEmptyValues(additionOptions)) {
                     if (onlyNumbers)
                         val = NaN;
                     else
@@ -1484,13 +1480,8 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                 if (val != null) {
                     if ($.isNumeric(val)) {
                         val = parseFloat(val);
-                        // if (val > -1 && val < 1) {
-                        //     val = parseFloat(val.toPrecision(4));
-                        // } else {
-                        //     val = parseFloat(val.toFixed(2));
-                        // }
                     }
-                } else {
+                } else if (helpers.isShowingEmptyValues(additionOptions)) {
                     if (onlyNumbers)
                         val = NaN;
                     else
@@ -1575,6 +1566,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                 } else if (seriesIndex === chart_series.length - 1 && chart_series.length > 1 && !has_delta && !opts.total && !trendSerieses.length) {
                     series.type = 'line';
                 }
+                series.connectNulls = !helpers.isShowingEmptyValues(additionOptions);
             });
         }
 
@@ -2532,7 +2524,8 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     enabled: additionOptions && additionOptions.label ? additionOptions.label.show : true,
                     formatter: highchartsRenderer.defaultDataLabelFormatter(pivotData, opts),
                     style: highchartsRenderer.getDataLabelsStyle(additionOptions)
-                }
+                },
+                connectNulls: !helpers.isShowingEmptyValues(additionOptions),
             }
         };
 
@@ -2621,7 +2614,8 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     enabled: additionOptions && additionOptions.label ? additionOptions.label.show : true,
                     formatter: highchartsRenderer.defaultDataLabelFormatter(pivotData, opts),
                     style: highchartsRenderer.getDataLabelsStyle(additionOptions)
-                }
+                },
+                connectNulls: !helpers.isShowingEmptyValues(additionOptions),
             }
         };
 
@@ -2717,8 +2711,9 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     allowOverlap: additionOptions && additionOptions.label ? additionOptions.label.overlap : false,
                     enabled: additionOptions && additionOptions.label ? additionOptions.label.show : true,
                     formatter: highchartsRenderer.defaultDataLabelFormatter(pivotData, opts),
-                    style: highchartsRenderer.getDataLabelsStyle(additionOptions)
-                }
+                    style: highchartsRenderer.getDataLabelsStyle(additionOptions),
+                },
+                connectNulls: !helpers.isShowingEmptyValues(additionOptions),
             }
         };
 
@@ -2804,13 +2799,14 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             }
         };
         chartOptions = highchartsRenderer.prepareAxisX(chartOptions, additionOptions, pivotData.getColKeys());
-        chartOptions.series = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, null, null, null, opts, chartOptions);
+        chartOptions.series = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, null, null, additionOptions, opts, chartOptions);
 
         highchartsRenderer.handleGridLines(additionOptions, chartOptions);
 
+        const isShowingEmptyValues = helpers.isShowingEmptyValues(additionOptions);
         chartOptions.plotOptions = {
             [type === 'area-chart' ? 'area' : 'areaspline']: {
-                stacking: 'normal',
+                stacking: isShowingEmptyValues ? 'normal' : undefined,
                 lineColor: CHART_COLORS.TICK_COLOR,
                 lineWidth: 1,
                 marker: {
@@ -2825,7 +2821,8 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     enabled: additionOptions && additionOptions.label ? additionOptions.label.show : true,
                     formatter: highchartsRenderer.defaultDataLabelFormatter(pivotData, opts),
                     style: highchartsRenderer.getDataLabelsStyle(additionOptions)
-                }
+                },
+                connectNulls: !isShowingEmptyValues,
             }
         };
 
@@ -2884,7 +2881,8 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     enabled: additionOptions && additionOptions.label ? additionOptions.label.show : true,
                     formatter: highchartsRenderer.defaultDataLabelFormatter(pivotData, opts),
                     style: highchartsRenderer.getDataLabelsStyle(additionOptions)
-                }
+                },
+                connectNulls: !helpers.isShowingEmptyValues(additionOptions),
             }
         };
 
@@ -2911,7 +2909,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             },
             lineWidth: 0
         };
-        chartOptions.series = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, null, null, null, opts, chartOptions);
+        chartOptions.series = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, null, null, additionOptions, opts, chartOptions);
 
         chartOptions.legend = highchartsRenderer.getOptionsForLegends(additionOptions, rowAttrs.length, false);
 
@@ -2981,7 +2979,6 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             highchartsRenderer.setYAxisMinMax(chartOptions.yAxis, additionOptions.axisY);
         }
 
-
         chartOptions.tooltip = {
             formatter: highchartsRenderer.defaultFormatterToTooltip(pivotData, opts),
             valueDecimals: 2,
@@ -3012,7 +3009,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     enabled: additionOptions && additionOptions.label ? additionOptions.label.show : true,
                     formatter: highchartsRenderer.defaultDataLabelFormatter(pivotData, opts),
                     style: highchartsRenderer.getDataLabelsStyle(additionOptions)
-                }
+                },
             }
         };
         if (opts.drillDownListFunc) {
@@ -3319,7 +3316,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             },
         };
         chartOptions = highchartsRenderer.prepareAxisX(chartOptions, additionOptions, pivotData.getColKeys());
-        chartOptions.series = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, null, null, null, opts, chartOptions);
+        chartOptions.series = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, null, null, additionOptions, opts, chartOptions);
 
         highchartsRenderer.handleGridLines(additionOptions, chartOptions)
 
@@ -3337,7 +3334,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                     enabled: additionOptions && additionOptions.label ? additionOptions.label.show : true,
                     formatter: highchartsRenderer.defaultDataLabelFormatter(pivotData, opts),
                     style: highchartsRenderer.getDataLabelsStyle(additionOptions)
-                }
+                },
             }
         };
 
@@ -3445,7 +3442,7 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             },
         };
         chartOptions = highchartsRenderer.prepareAxisX(chartOptions, additionOptions, pivotData.getColKeys());
-        chartOptions.series = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, null, null, null, opts, chartOptions);
+        chartOptions.series = highchartsRenderer.ptCreateBasicLineSeries(pivotData, null, null, null, additionOptions, opts, chartOptions);
 
         if (opts.selectedPoint) {
             seriesPointStylesHelper.setInitialPointStyles(opts, chartOptions.series);
@@ -6594,12 +6591,13 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
             category_class: 'google-visualization-charteditor-mini-more',
             category_label: 'Chart',
             category_type: 'chart',
-            elements: [{
-                element_type: 'input',
-                value_name: 'colors_offset',
-                element_label: 'Colors offset',
-                default_value: 0
-            },
+            elements: [
+                {
+                    element_type: 'input',
+                    value_name: 'colors_offset',
+                    element_label: 'Colors offset',
+                    default_value: 0
+                },
                 {
                     element_type: 'radio',
                     value_name: 'zoom_type',
@@ -6611,12 +6609,19 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                         {label: 'xy', value: 'xy'}
                     ],
                     default_value: 'None'
-                }, {
+                },
+                {
                     element_type: 'checkbox',
                     value_name: 'show',
                     element_label: 'Show grid',
                     default_value: true
-                }
+                },
+                {
+                    element_type: 'checkbox',
+                    value_name: 'dislay_empty_values',
+                    element_label: 'Display empty values',
+                    default_value: true
+                },
             ]
         },
         'chart_grid': {
@@ -6639,6 +6644,12 @@ let getHighchartsRenderer = function ($, document, Highcharts, default_colors, h
                 element_label: 'Show legends over 10',
                 default_value: false
             },
+            {
+                element_type: 'checkbox',
+                value_name: 'dislay_empty_values',
+                element_label: 'Display empty values',
+                default_value: true
+            },
             {
                 element_type: 'devider',
                 element_label: 'Chart Patterns',

package/tests/highcharts_renderer.test.js

@@ -6811,6 +6811,7 @@ describe('highcharts_renderer', () => {
                         formatter: expect.any(Function),
                     },
                     color: '#ff0202',
+                    connectNulls: false,
                     type: 'area'
                 },
                 {data: [
@@ -6846,6 +6847,7 @@ describe('highcharts_renderer', () => {
                         enabled: true,
                         formatter: expect.any(Function),
                     },
+                    connectNulls: false,
                     color: '#b3060e',
                     type: 'line'
                 }