Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
chartjs-plugin-waterfall
Advanced tools
chartjs-plugin-waterfall - npm Package Compare versions
Comparing version 0.0.4 to 0.0.5
@@ -82,5 +82,2 @@ (function (global, factory) { | ||
| endColor: 'rgba(0, 0, 0, 0)' // transparent | ||
| }, | ||
| _status: { | ||
| readyToDrawStepLines: false | ||
| } | ||
@@ -90,2 +87,4 @@ } | ||
| var status = {}; | ||
| var filterDummyStacks = function filterDummyStacks(legendItem, chartData) { | ||
@@ -98,10 +97,5 @@ var currentDataset = chartData.datasets[legendItem.datasetIndex]; | ||
| var waterFallPlugin = { | ||
| afterRender: function afterRender(chart) { | ||
| var onComplete = chart.options.animation.onComplete; | ||
| chart.options.animation.onComplete = function () { | ||
| chart.options.plugins.waterFallPlugin._status.readyToDrawStepLines = true; | ||
| drawStepLines(chart); | ||
| onComplete.apply(undefined, arguments); | ||
| beforeInit: function beforeInit(chart) { | ||
| status[chart.id] = { | ||
| readyToDrawStepLines: false | ||
| }; | ||
@@ -114,2 +108,9 @@ }, | ||
| // Can't override onComplete function because it gets overwridden if user using React | ||
| setTimeout(function () { | ||
| status[chart.id].readyToDrawStepLines = true; | ||
| drawStepLines(chart); | ||
| }, chart.options.animation.duration); | ||
| chart.data.datasets.forEach(function (dataset, i) { | ||
@@ -126,3 +127,3 @@ // Each dataset must have a unique label so we set the dummy stacks to have dummy labels | ||
| if (options.stepLines.enabled && options._status.readyToDrawStepLines) { | ||
| if (options.stepLines.enabled && status[chart.id].readyToDrawStepLines) { | ||
| drawStepLines(chart); | ||
@@ -129,0 +130,0 @@ } |
@@ -1,2 +0,2 @@ | ||
| !function(t,o){"object"==typeof exports&&"undefined"!=typeof module?module.exports=o(require("lodash.merge"),require("lodash.groupby")):"function"==typeof define&&define.amd?define(["lodash.merge","lodash.groupby"],o):t.chartjsWPluginWaterfall=o(t._.merge,t._.groupby)}(this,function(t,o){"use strict";t=t&&t.hasOwnProperty("default")?t.default:t,o=o&&o.hasOwnProperty("default")?o.default:o;var a=function(t){var a=t.ctx,e=t.data.datasets,s=t.options.plugins.waterFallPlugin.stepLines,n=o(e,"stack"),r=[],l=function(t){var o=Object.keys(t._meta)[0];return t._meta[o].data[0]._model};Object.keys(n).forEach(function(t){var o=n[t],a=l(o.find(function(t){return!t.dummyStack})),e=l(o[0]),s=l(o[o.length-1]);r.push({stackRightXPos:e.x+e.width/2,stackLeftXPos:e.x-e.width/2,stackRealBottomYPos:a.base,stackBottomYPos:e.base,stackTopYPos:s.y})});for(var i=0;i<r.length;i+=1){var c=r[i];if(i!==r.length-1){var d=r[i+1];c.stackTopYPos===d.stackRealBottomYPos?d.stackTopYPos=d.stackRealBottomYPos:c.stackRealBottomYPos===d.stackTopYPos&&(c.stackTopYPos=c.stackRealBottomYPos);var p=a.createLinearGradient(0,d.stackTopYPos,0,d.stackBottomYPos);p.addColorStop(s.startColorStop,s.startColor),p.addColorStop(s.endColorStop,s.endColor),a.fillStyle=p,a.beginPath(),a.lineTo(c.stackRightXPos,c.stackTopYPos),a.lineTo(d.stackLeftXPos,d.stackTopYPos),a.lineTo(d.stackLeftXPos,d.stackBottomYPos),a.lineTo(c.stackRightXPos,c.stackBottomYPos),a.fill()}}},e={waterFallPlugin:{stepLines:{enabled:!0,startColorStop:0,endColorStop:.6,startColor:"rgba(0, 0, 0, 0.55)",endColor:"rgba(0, 0, 0, 0)"},_status:{readyToDrawStepLines:!1}}},s=function(t,o){return!o.datasets[t.datasetIndex].dummyStack};return{afterRender:function(t){var o=t.options.animation.onComplete;t.options.animation.onComplete=function(){t.options.plugins.waterFallPlugin._status.readyToDrawStepLines=!0,a(t),o.apply(void 0,arguments)}},afterInit:function(o){o.options.plugins=t({},e,o.options.plugins),o.options.tooltips.filter=s,o.options.legend.labels.filter=s,o.data.datasets.forEach(function(t,o){t.dummyStack&&(t.label="dummyStack_"+o,t.backgroundColor="rgba(0, 0, 0, 0)")})},afterDraw:function(t){var o=t.options.plugins.waterFallPlugin;o.stepLines.enabled&&o._status.readyToDrawStepLines&&a(t)}}}); | ||
| !function(t,o){"object"==typeof exports&&"undefined"!=typeof module?module.exports=o(require("lodash.merge"),require("lodash.groupby")):"function"==typeof define&&define.amd?define(["lodash.merge","lodash.groupby"],o):t.chartjsWPluginWaterfall=o(t._.merge,t._.groupby)}(this,function(t,o){"use strict";t=t&&t.hasOwnProperty("default")?t.default:t,o=o&&o.hasOwnProperty("default")?o.default:o;var a=function(t){var a=t.ctx,e=t.data.datasets,s=t.options.plugins.waterFallPlugin.stepLines,n=o(e,"stack"),r=[],i=function(t){var o=Object.keys(t._meta)[0];return t._meta[o].data[0]._model};Object.keys(n).forEach(function(t){var o=n[t],a=i(o.find(function(t){return!t.dummyStack})),e=i(o[0]),s=i(o[o.length-1]);r.push({stackRightXPos:e.x+e.width/2,stackLeftXPos:e.x-e.width/2,stackRealBottomYPos:a.base,stackBottomYPos:e.base,stackTopYPos:s.y})});for(var l=0;l<r.length;l+=1){var d=r[l];if(l!==r.length-1){var c=r[l+1];d.stackTopYPos===c.stackRealBottomYPos?c.stackTopYPos=c.stackRealBottomYPos:d.stackRealBottomYPos===c.stackTopYPos&&(d.stackTopYPos=d.stackRealBottomYPos);var u=a.createLinearGradient(0,c.stackTopYPos,0,c.stackBottomYPos);u.addColorStop(s.startColorStop,s.startColor),u.addColorStop(s.endColorStop,s.endColor),a.fillStyle=u,a.beginPath(),a.lineTo(d.stackRightXPos,d.stackTopYPos),a.lineTo(c.stackLeftXPos,c.stackTopYPos),a.lineTo(c.stackLeftXPos,c.stackBottomYPos),a.lineTo(d.stackRightXPos,d.stackBottomYPos),a.fill()}}},e={waterFallPlugin:{stepLines:{enabled:!0,startColorStop:0,endColorStop:.6,startColor:"rgba(0, 0, 0, 0.55)",endColor:"rgba(0, 0, 0, 0)"}}},s={},n=function(t,o){return!o.datasets[t.datasetIndex].dummyStack};return{beforeInit:function(t){s[t.id]={readyToDrawStepLines:!1}},afterInit:function(o){o.options.plugins=t({},e,o.options.plugins),o.options.tooltips.filter=n,o.options.legend.labels.filter=n,setTimeout(function(){s[o.id].readyToDrawStepLines=!0,a(o)},o.options.animation.duration),o.data.datasets.forEach(function(t,o){t.dummyStack&&(t.label="dummyStack_"+o,t.backgroundColor="rgba(0, 0, 0, 0)")})},afterDraw:function(t){t.options.plugins.waterFallPlugin.stepLines.enabled&&s[t.id].readyToDrawStepLines&&a(t)}}}); | ||
| //# sourceMappingURL=chartjs-plugin-waterfall.min.js.map |
@@ -80,5 +80,2 @@ 'use strict'; | ||
| endColor: 'rgba(0, 0, 0, 0)' // transparent | ||
| }, | ||
| _status: { | ||
| readyToDrawStepLines: false | ||
| } | ||
@@ -88,2 +85,4 @@ } | ||
| var status = {}; | ||
| var filterDummyStacks = function filterDummyStacks(legendItem, chartData) { | ||
@@ -96,10 +95,5 @@ var currentDataset = chartData.datasets[legendItem.datasetIndex]; | ||
| var waterFallPlugin = { | ||
| afterRender: function afterRender(chart) { | ||
| var onComplete = chart.options.animation.onComplete; | ||
| chart.options.animation.onComplete = function () { | ||
| chart.options.plugins.waterFallPlugin._status.readyToDrawStepLines = true; | ||
| drawStepLines(chart); | ||
| onComplete.apply(undefined, arguments); | ||
| beforeInit: function beforeInit(chart) { | ||
| status[chart.id] = { | ||
| readyToDrawStepLines: false | ||
| }; | ||
@@ -112,2 +106,9 @@ }, | ||
| // Can't override onComplete function because it gets overwridden if user using React | ||
| setTimeout(function () { | ||
| status[chart.id].readyToDrawStepLines = true; | ||
| drawStepLines(chart); | ||
| }, chart.options.animation.duration); | ||
| chart.data.datasets.forEach(function (dataset, i) { | ||
@@ -124,3 +125,3 @@ // Each dataset must have a unique label so we set the dummy stacks to have dummy labels | ||
| if (options.stepLines.enabled && options._status.readyToDrawStepLines) { | ||
| if (options.stepLines.enabled && status[chart.id].readyToDrawStepLines) { | ||
| drawStepLines(chart); | ||
@@ -127,0 +128,0 @@ } |
@@ -5,3 +5,3 @@ { | ||
| "description": "Chart.js plugin for easy waterfall charts", | ||
| "version": "0.0.4", | ||
| "version": "0.0.5", | ||
| "license": "MIT", | ||
@@ -8,0 +8,0 @@ "main": "lib/chartjs-plugin-waterfall.js", |
@@ -97,5 +97,2 @@ ### Installation | ||
| ### Internals | ||
| This plugin uses a `_status` property on the `options.plugins.waterFallPlugin` to track when to draw the stepLines after any animations complete. Don't overwrite this. | ||
| ### Caveats | ||
@@ -106,3 +103,3 @@ - This plugin presumes that each of yours bars in your chart match up either at the top or the bottom of each bar. | ||
| - The invisible dummy stacks are removed from the [tooltip](http://www.chartjs.org/docs/latest/configuration/tooltip.html#filter-callback) | ||
| and [legend](http://www.chartjs.org/docs/latest/configuration/legend.html#legend-label-configuration) by default using the `filter` mehthod. | ||
| and [legend](http://www.chartjs.org/docs/latest/configuration/legend.html#legend-label-configuration) by default using the `filter` method. | ||
| If you are providing your own filter method, using a custom tooltip or legend of your own then you will have to manually hide them because it will overwrite this plugins. | ||
@@ -109,0 +106,0 @@ |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
New alerts
License Policy Violation
LicenseThis 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
LicenseThis 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
- decreased by-0.84%
40564
- Number of lines in readme file
- decreased by-2.56%
114
No dependency changes