chartjs-plugin-empty-overlay - npm Package Compare versions

Comparing version 1.0.1 to 1.0.2

dist/chartjs-plugin-empty-overlay.js

 /*!
  * chartjs-plugin-empty-overlay
  * http://neverbounce.com/
- * Version: 1.0.1
+ * Version: 1.0.2
  *
@@ -12,3 +12,3 @@ * Copyright 2017 NeverBounce
 
-(function () {
+(function() {
 
@@ -40,9 +40,9 @@ var Chart = window.Chart;
         // Filter down the datasets to determine if they contain non zero values
-        var filtered = datasets.map(function (element) {
-            var fltr = element.data.filter(function (ele) {
+        var filtered = datasets.map(function(element) {
+            var fltr = element.data.filter(function(ele) {
                 // Support data expressed as x,y coordinates as well as y only values
                 return ele.x ? (ele.x > 0) : (ele > 0);
             });
-            return fltr.length > 0
-        }).filter(function (element) {
+            return fltr.length > 0;
+        }).filter(function(element) {
             return element;
@@ -58,3 +58,3 @@ });
 
-        initialize: function (config) {
+        initialize: function(config) {
             helpers.extend(this, config);
@@ -64,8 +64,13 @@ },
         // Shared Methods
-        isHorizontal: function () {
-            return this.options.position === 'top' || this.options.position === 'bottom';
+        isHorizontal: function() {
+            return this.options.position === 'top' ||
+                this.options.position === 'bottom';
         },
 
+        // no-op
+        update: function() {
+        },
+
         // Actually draw the legend on the canvas
-        draw: function () {
+        draw: function() {
             var me = this;
@@ -85,9 +90,15 @@ var ctx = me.ctx;
                 message = emptyOpts.message,
-                fontSizeOpt = itemOrDefault(emptyOpts.fontSize, globalDefault.defaultFontSize),
-                fontSize = (fontSizeOpt === 'auto' ? (Math.sqrt(width)) : fontSizeOpt),
-                fontStyle = itemOrDefault(emptyOpts.fontStyle, globalDefault.defaultFontStyle),
-                fontFamily = itemOrDefault(emptyOpts.fontFamily, globalDefault.defaultFontFamily),
+                fontSizeOpt = itemOrDefault(emptyOpts.fontSize,
+                    globalDefault.defaultFontSize),
+                fontSize = (fontSizeOpt === 'auto' ?
+                    (Math.sqrt(width)) :
+                    fontSizeOpt),
+                fontStyle = itemOrDefault(emptyOpts.fontStyle,
+                    globalDefault.defaultFontStyle),
+                fontFamily = itemOrDefault(emptyOpts.fontFamily,
+                    globalDefault.defaultFontFamily),
                 labelFont = helpers.fontString(fontSize, fontStyle, fontFamily);
 
-            ctx.fillStyle = itemOrDefault(emptyOpts.fillStyle, globalDefault.defaultColor);
+            ctx.fillStyle = itemOrDefault(emptyOpts.fillStyle,
+                globalDefault.defaultColor);
             ctx.fillRect(x, y, width, height);
@@ -103,3 +114,4 @@
 
-            ctx.fillStyle = itemOrDefault(emptyOpts.fontColor, globalDefault.defaultFontColor);
+            ctx.fillStyle = itemOrDefault(emptyOpts.fontColor,
+                globalDefault.defaultFontColor);
             ctx.fillText(message, textX, textY, width);
@@ -122,7 +134,8 @@ },
     Chart.plugins.register({
-        beforeInit: function (chartInstance) {
+        beforeInit: function(chartInstance) {
 
             // Merge config
             var emptyOpts = chartInstance.options.emptyOverlay || {};
-            emptyOpts = helpers.configMerge(Chart.defaults.global.emptyOverlay, emptyOpts);
+            emptyOpts = helpers.configMerge(Chart.defaults.global.emptyOverlay,
+                emptyOpts);
 
@@ -133,4 +146,5 @@ // Add config and create object
 
-        beforeUpdate: function (chartInstance) {
-            var empty = isChartEmpty(chartInstance.config.data.datasets, chartInstance.emptyOverlay);
+        beforeUpdate: function(chartInstance) {
+            var empty = isChartEmpty(chartInstance.config.data.datasets,
+                chartInstance.emptyOverlay);
             if (empty) {
@@ -142,7 +156,8 @@ chartInstance.config.data.datasets = [];
 
-        afterDatasetsDraw: function (chartInstance) {
+        afterDatasetsDraw: function(chartInstance) {
 
             // Merge config
             var emptyOpts = chartInstance.options.emptyOverlay || {};
-            emptyOpts = helpers.configMerge(Chart.defaults.global.emptyOverlay, emptyOpts);
+            emptyOpts = helpers.configMerge(Chart.defaults.global.emptyOverlay,
+                emptyOpts);
 
@@ -161,10 +176,12 @@ // Add config and create object if needed
                     chartInstance.emptyOverlayBox = true;
-                    Chart.layoutService.addBox(chartInstance, chartInstance.emptyOverlay);
+                    Chart.layoutService.addBox(chartInstance,
+                        chartInstance.emptyOverlay);
                 }
             } else if (chartInstance.emptyOverlayBox) {
-                Chart.layoutService.removeBox(chartInstance, chartInstance.emptyOverlay);
+                Chart.layoutService.removeBox(chartInstance,
+                    chartInstance.emptyOverlay);
                 delete chartInstance.emptyOverlayBox;
             }
-        }
+        },
     });
 }());

dist/chartjs-plugin-empty-overlay.min.js

 /*!
  * chartjs-plugin-empty-overlay
  * http://neverbounce.com/
- * Version: 1.0.1
+ * Version: 1.0.2
  *
@@ -10,2 +10,2 @@ * Copyright 2017 NeverBounce
  */
-"use strict";!function(){function t(t,e){(!t||t.length<1)&&(e.isEmpty=!0);var o=t.map(function(t){var e=t.data.filter(function(t){return t.x?t.x>0:t>0});return e.length>0}).filter(function(t){return t});return e.isEmpty=o.length<1}function e(t,e){var a=new o.EmptyOverlay({ctx:t.chart.ctx,options:e,originalConfig:t.config,chart:t,isEmpty:!1});t.emptyOverlay=a}var o=window.Chart,a=o.helpers;o.defaults.global.emptyOverlay={enabled:!0,message:"No data available",fillStyle:"rgba(100,100,100,0.3)",fontColor:"rgba(100,100,100,1.0)",fontStroke:"rgba(255,255,255,0.6)",fontStrokeWidth:"3",fontSize:"auto"},o.EmptyOverlay=o.Element.extend({position:"chartArea",initialize:function(t){a.extend(this,t)},isHorizontal:function(){return"top"===this.options.position||"bottom"===this.options.position},draw:function(){var t=this,e=t.ctx,l=o.defaults.global,n=t.options,i=t.chart.chartArea,r=i.left,f=i.top,y=i.right-i.left,s=i.bottom-i.top,p=r/2+y/2,m=f+s/2,u=a.getValueOrDefault,c=n.message,d=u(n.fontSize,l.defaultFontSize),v="auto"===d?Math.sqrt(y):d,g=u(n.fontStyle,l.defaultFontStyle),h=u(n.fontFamily,l.defaultFontFamily),O=a.fontString(v,g,h);e.fillStyle=u(n.fillStyle,l.defaultColor),e.fillRect(r,f,y,s),e.textAlign="center",e.textBaseline="middle",e.font=O,e.lineWidth=n.fontStrokeWidth,e.miterLimit=2,e.strokeStyle=n.fontStroke,e.strokeText(c,p,m,y),e.fillStyle=u(n.fontColor,l.defaultFontColor),e.fillText(c,p,m,y)}}),o.plugins.register({beforeInit:function(t){var l=t.options.emptyOverlay||{};l=a.configMerge(o.defaults.global.emptyOverlay,l),e(t,l)},beforeUpdate:function(e){var o=t(e.config.data.datasets,e.emptyOverlay);o&&(e.config.data.datasets=[],e.config.data.labels=[])},afterDatasetsDraw:function(t){var l=t.options.emptyOverlay||{};l=a.configMerge(o.defaults.global.emptyOverlay,l),t.emptyOverlay?t.emptyOverlay.options=l:e(t,l),l.enabled&&t.emptyOverlay.isEmpty?t.emptyOverlayBox||(t.emptyOverlayBox=!0,o.layoutService.addBox(t,t.emptyOverlay)):t.emptyOverlayBox&&(o.layoutService.removeBox(t,t.emptyOverlay),delete t.emptyOverlayBox)}})}();
+"use strict";!function(){function t(t,e){(!t||t.length<1)&&(e.isEmpty=!0);var o=t.map(function(t){var e=t.data.filter(function(t){return t.x?t.x>0:t>0});return e.length>0}).filter(function(t){return t});return e.isEmpty=o.length<1}function e(t,e){var a=new o.EmptyOverlay({ctx:t.chart.ctx,options:e,originalConfig:t.config,chart:t,isEmpty:!1});t.emptyOverlay=a}var o=window.Chart,a=o.helpers;o.defaults.global.emptyOverlay={enabled:!0,message:"No data available",fillStyle:"rgba(100,100,100,0.3)",fontColor:"rgba(100,100,100,1.0)",fontStroke:"rgba(255,255,255,0.6)",fontStrokeWidth:"3",fontSize:"auto"},o.EmptyOverlay=o.Element.extend({position:"chartArea",initialize:function(t){a.extend(this,t)},isHorizontal:function(){return"top"===this.options.position||"bottom"===this.options.position},update:function(){},draw:function(){var t=this,e=t.ctx,l=o.defaults.global,n=t.options,i=t.chart.chartArea,r=i.left,f=i.top,y=i.right-i.left,s=i.bottom-i.top,p=r/2+y/2,u=f+s/2,m=a.getValueOrDefault,c=n.message,d=m(n.fontSize,l.defaultFontSize),v="auto"===d?Math.sqrt(y):d,g=m(n.fontStyle,l.defaultFontStyle),h=m(n.fontFamily,l.defaultFontFamily),O=a.fontString(v,g,h);e.fillStyle=m(n.fillStyle,l.defaultColor),e.fillRect(r,f,y,s),e.textAlign="center",e.textBaseline="middle",e.font=O,e.lineWidth=n.fontStrokeWidth,e.miterLimit=2,e.strokeStyle=n.fontStroke,e.strokeText(c,p,u,y),e.fillStyle=m(n.fontColor,l.defaultFontColor),e.fillText(c,p,u,y)}}),o.plugins.register({beforeInit:function(t){var l=t.options.emptyOverlay||{};l=a.configMerge(o.defaults.global.emptyOverlay,l),e(t,l)},beforeUpdate:function(e){var o=t(e.config.data.datasets,e.emptyOverlay);o&&(e.config.data.datasets=[],e.config.data.labels=[])},afterDatasetsDraw:function(t){var l=t.options.emptyOverlay||{};l=a.configMerge(o.defaults.global.emptyOverlay,l),t.emptyOverlay?t.emptyOverlay.options=l:e(t,l),l.enabled&&t.emptyOverlay.isEmpty?t.emptyOverlayBox||(t.emptyOverlayBox=!0,o.layoutService.addBox(t,t.emptyOverlay)):t.emptyOverlayBox&&(o.layoutService.removeBox(t,t.emptyOverlay),delete t.emptyOverlayBox)}})}();

package.json

@@ -5,3 +5,3 @@ {
   "description": "Chart.js plugin to replace empty plots with a friendly placeholder",
-  "version": "1.0.1",
+  "version": "1.0.2",
   "license": "MIT",
@@ -17,3 +17,3 @@ "main": "src/plugin.js",
     "type": "git",
-    "url": "https://github.com/chartjs/chartjs-plugin-deferred.git"
+    "url": "https://github.com/NeverBounce/chartjs-plugin-empty-overlay.git"
   },
@@ -20,0 +20,0 @@ "devDependencies": {

samples/utils.js

 var Samples = window.Samples || {};
-Samples.utils = {
-    defaultBarOptions: function () {
-        return {
-            responsive: false,
-            legend: {
-                position: 'top'
-            },
-            animation: {
-                duration: 2000
-            }
-        };
-    },
 
-    generateBarData: function () {
-        var datasets = [];
-        var labels = [];
-        var ilen = 4;
-        var jlen = 4;
-        var dataset;
-        var i, j;
+var generateDataSet = function(ilen, jlen, zeroValues) {
+    var datasets = [];
+    var dataset;
+    var i, j;
 
-        for (i = 0; i < ilen; ++i) {
-            dataset = {data: [], backgroundColor: [], label: 'DS' + i};
-            for (j = 0; j < jlen; ++j) {
+    for (i = 0; i < ilen; ++i) {
+        dataset = {data: [], backgroundColor: [], label: 'DS' + i};
+        for (j = 0; j < jlen; ++j) {
+            if (zeroValues)
+                dataset.data.push(0);
+            else
                 dataset.data.push(Math.round(Math.random() * 100));
-                dataset.backgroundColor.push(
-                    'rgba(' +
-                    (((j + i + 1) * 16) % 256) + ',' +
-                    (((j + i + 2) * 32) % 256) + ',' +
-                    (((j + i + 3) * 64) % 256) + ', 0.32)'
-                );
-            }
-
-            datasets.push(dataset);
         }
 
-        for (j = 0; j < jlen; ++j) {
-            labels.push('D' + i);
-        }
+        let color = (((j + i + 1) * 16) % 256) + ',' +
+            (((j + i + 2) * 32) % 256) + ',' +
+            (((j + i + 3) * 64) % 256);
 
-        return {
-            datasets: datasets,
-            labels: labels
-        };
-    },
+        dataset.borderColor = 'rgba(' + color + ', .68)';
+        dataset.backgroundColor = 'rgba(' + color + ', 0.32)';
 
-    defaultLineOptions: function () {
+        datasets.push(dataset);
+    }
+
+    return datasets;
+};
+
+Samples.utils = {
+
+    defaultLineOptions: function() {
         return {
             responsive: true,
             legend: {
-                position: 'top'
+                position: 'top',
             },
             animation: {
-                duration: 2000
-            }
+                duration: 2000,
+            },
         };
     },
 
-    generateLineData: function () {
-        var datasets = [];
+    generateLineData: function() {
         var labels = [];
         var ilen = 3;
         var jlen = 3;
-        var dataset;
-        var i, j;
+        var datasets = generateDataSet(ilen, jlen);
 
-        for (i = 0; i < ilen; ++i) {
-            dataset = {data: [], backgroundColor: [], label: 'DS' + i};
-            for (j = 0; j < jlen; ++j) {
-                dataset.data.push(Math.round(Math.random() * 100));
-            }
-
-            let color = (((j + i + 1) * 16) % 256) + ',' +
-                (((j + i + 2) * 32) % 256) + ',' +
-                (((j + i + 3) * 64) % 256);
-
-            dataset.borderColor = 'rgba(' + color + ', .68)';
-            dataset.backgroundColor = 'rgba(' + color + ', 0.32)';
-
-            datasets.push(dataset);
-        }
-
-        for (j = 0; j < jlen; ++j) {
+        for (var j = 0; j < jlen; ++j) {
             labels.push(j);
@@ -90,31 +56,13 @@ }
             datasets: datasets,
-            labels: labels
+            labels: labels,
         };
     },
 
-    generateLineDataZero: function () {
-        var datasets = [];
+    generateLineDataZero: function() {
         var labels = [];
         var ilen = 3;
         var jlen = 3;
-        var dataset;
-        var i, j;
+        var datasets = generateDataSet(ilen, jlen, true);
 
-        for (i = 0; i < ilen; ++i) {
-            dataset = {data: [], backgroundColor: [], label: 'DS' + i};
-            for (j = 0; j < jlen; ++j) {
-                dataset.data.push(0);
-            }
-
-            let color = (((j + i + 1) * 16) % 256) + ',' +
-                (((j + i + 2) * 32) % 256) + ',' +
-                (((j + i + 3) * 64) % 256);
-
-            dataset.borderColor = 'rgba(' + color + ', .68)';
-            dataset.backgroundColor = 'rgba(' + color + ', 0.32)';
-
-            datasets.push(dataset);
-        }
-
-        for (j = 0; j < jlen; ++j) {
+        for (var j = 0; j < jlen; ++j) {
             labels.push(j);
@@ -125,40 +73,12 @@ }
             datasets: datasets,
-            labels: labels
+            labels: labels,
         };
     },
 
-    generateLineNoData: function () {
-        var datasets = [];
-        var labels = [];
-        var ilen = 0;
-        var jlen = 0;
-        var dataset;
-        var i, j;
-
-        for (i = 0; i < ilen; ++i) {
-            dataset = {data: [], backgroundColor: [], label: 'DS' + i};
-            for (j = 0; j < jlen; ++j) {
-                // dataset.data.push(Math.round(Math.random() * 100));
-                dataset.data.push(0);
-            }
-
-            let color = (((j + i + 1) * 16) % 256) + ',' +
-                (((j + i + 2) * 32) % 256) + ',' +
-                (((j + i + 3) * 64) % 256);
-
-            dataset.borderColor = 'rgba(' + color + ', .68)';
-            dataset.backgroundColor = 'rgba(' + color + ', 0.32)';
-
-            datasets.push(dataset);
-        }
-
-        for (j = 0; j < jlen; ++j) {
-            labels.push(j);
-        }
-
+    generateLineNoData: function() {
         return {
             datasets: [],
-            labels: labels
+            labels: [],
         };
     },
 };

src/plugin.js

 'use strict';
 
-(function () {
+(function() {
 
@@ -30,9 +30,9 @@ var Chart = window.Chart;
         // Filter down the datasets to determine if they contain non zero values
-        var filtered = datasets.map(function (element) {
-            var fltr = element.data.filter(function (ele) {
+        var filtered = datasets.map(function(element) {
+            var fltr = element.data.filter(function(ele) {
                 // Support data expressed as x,y coordinates as well as y only values
                 return ele.x ? (ele.x > 0) : (ele > 0);
             });
-            return fltr.length > 0
-        }).filter(function (element) {
+            return fltr.length > 0;
+        }).filter(function(element) {
             return element;
@@ -48,3 +48,3 @@ });
 
-        initialize: function (config) {
+        initialize: function(config) {
             helpers.extend(this, config);
@@ -54,8 +54,13 @@ },
         // Shared Methods
-        isHorizontal: function () {
-            return this.options.position === 'top' || this.options.position === 'bottom';
+        isHorizontal: function() {
+            return this.options.position === 'top' ||
+                this.options.position === 'bottom';
         },
 
+        // no-op
+        update: function() {
+        },
+
         // Actually draw the legend on the canvas
-        draw: function () {
+        draw: function() {
             var me = this;
@@ -75,9 +80,15 @@ var ctx = me.ctx;
                 message = emptyOpts.message,
-                fontSizeOpt = itemOrDefault(emptyOpts.fontSize, globalDefault.defaultFontSize),
-                fontSize = (fontSizeOpt === 'auto' ? (Math.sqrt(width)) : fontSizeOpt),
-                fontStyle = itemOrDefault(emptyOpts.fontStyle, globalDefault.defaultFontStyle),
-                fontFamily = itemOrDefault(emptyOpts.fontFamily, globalDefault.defaultFontFamily),
+                fontSizeOpt = itemOrDefault(emptyOpts.fontSize,
+                    globalDefault.defaultFontSize),
+                fontSize = (fontSizeOpt === 'auto' ?
+                    (Math.sqrt(width)) :
+                    fontSizeOpt),
+                fontStyle = itemOrDefault(emptyOpts.fontStyle,
+                    globalDefault.defaultFontStyle),
+                fontFamily = itemOrDefault(emptyOpts.fontFamily,
+                    globalDefault.defaultFontFamily),
                 labelFont = helpers.fontString(fontSize, fontStyle, fontFamily);
 
-            ctx.fillStyle = itemOrDefault(emptyOpts.fillStyle, globalDefault.defaultColor);
+            ctx.fillStyle = itemOrDefault(emptyOpts.fillStyle,
+                globalDefault.defaultColor);
             ctx.fillRect(x, y, width, height);
@@ -93,3 +104,4 @@
 
-            ctx.fillStyle = itemOrDefault(emptyOpts.fontColor, globalDefault.defaultFontColor);
+            ctx.fillStyle = itemOrDefault(emptyOpts.fontColor,
+                globalDefault.defaultFontColor);
             ctx.fillText(message, textX, textY, width);
@@ -112,7 +124,8 @@ },
     Chart.plugins.register({
-        beforeInit: function (chartInstance) {
+        beforeInit: function(chartInstance) {
 
             // Merge config
             var emptyOpts = chartInstance.options.emptyOverlay || {};
-            emptyOpts = helpers.configMerge(Chart.defaults.global.emptyOverlay, emptyOpts);
+            emptyOpts = helpers.configMerge(Chart.defaults.global.emptyOverlay,
+                emptyOpts);
 
@@ -123,4 +136,5 @@ // Add config and create object
 
-        beforeUpdate: function (chartInstance) {
-            var empty = isChartEmpty(chartInstance.config.data.datasets, chartInstance.emptyOverlay);
+        beforeUpdate: function(chartInstance) {
+            var empty = isChartEmpty(chartInstance.config.data.datasets,
+                chartInstance.emptyOverlay);
             if (empty) {
@@ -132,7 +146,8 @@ chartInstance.config.data.datasets = [];
 
-        afterDatasetsDraw: function (chartInstance) {
+        afterDatasetsDraw: function(chartInstance) {
 
             // Merge config
             var emptyOpts = chartInstance.options.emptyOverlay || {};
-            emptyOpts = helpers.configMerge(Chart.defaults.global.emptyOverlay, emptyOpts);
+            emptyOpts = helpers.configMerge(Chart.defaults.global.emptyOverlay,
+                emptyOpts);
 
@@ -151,10 +166,12 @@ // Add config and create object if needed
                     chartInstance.emptyOverlayBox = true;
-                    Chart.layoutService.addBox(chartInstance, chartInstance.emptyOverlay);
+                    Chart.layoutService.addBox(chartInstance,
+                        chartInstance.emptyOverlay);
                 }
             } else if (chartInstance.emptyOverlayBox) {
-                Chart.layoutService.removeBox(chartInstance, chartInstance.emptyOverlay);
+                Chart.layoutService.removeBox(chartInstance,
+                    chartInstance.emptyOverlay);
                 delete chartInstance.emptyOverlayBox;
             }
-        }
+        },
     });
 }());

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Worsened metrics

Total package byte prevSize

36232

decreased by-4.83%

Lines of code

568

decreased by-5.96%

No dependency changes