fixes

Author: DocX

lib/index.js

@@ -119,13 +119,22 @@ var ChartComponent = function (_React$Component) {
         return true;
       }
 
-      return !(0, _lodash2.default)(this.shadowDataProp, nextProps.data);
+      var nextData = this.transformDataProp();
+      return !(0, _lodash2.default)(this.shadowDataProp, nextData);
     }
   }, {
     key: 'componentWillUnmount',
     value: function componentWillUnmount() {
       this.chart_instance.destroy();
     }
+  }, {
+    key: 'transformDataProp',
+    value: function transformDataProp() {
+      var data = this.props.data;
+
+      var node = _reactDom2.default.findDOMNode(this);
+      return typeof data == "function" ? data(node) : data;
+    }
 
     // Chart.js directly mutates the data.dataset objects by adding _meta proprerty
     // this makes impossible to compare the current and next data changes
@@ -135,28 +144,27 @@ var ChartComponent = function (_React$Component) {
   }, {
     key: 'memoizeDataProps',
     value: function memoizeDataProps() {
-      var data = this.props.data;
-
-
-      if (!data) {
+      if (!this.props.data) {
         return;
       }
 
+      var data = this.transformDataProp();
+
       this.shadowDataProp = _extends({}, data, {
         datasets: data.datasets && data.datasets.map(function (set) {
           return Object.assign({}, set);
         })
       });
+
+      return data;
     }
   }, {
     key: 'updateChart',
     value: function updateChart() {
-      var _props2 = this.props,
-          data = _props2.data,
-          options = _props2.options;
+      var options = this.props.options;
 
 
-      this.memoizeDataProps();
+      var data = this.memoizeDataProps();
 
       if (!this.chart_instance) return;
 
@@ -169,6 +177,11 @@ var ChartComponent = function (_React$Component) {
       var currentDatasets = this.chart_instance.config.data && this.chart_instance.config.data.datasets || [];
       var nextDatasets = data.datasets || [];
 
+      // Prevent charting of legend items that no longer exist
+      while (currentDatasets.length > nextDatasets.length) {
+        currentDatasets.pop();
+      }
+
       nextDatasets.forEach(function (dataset, sid) {
         if (currentDatasets[sid] && currentDatasets[sid].data) {
           currentDatasets[sid].data.splice(nextDatasets[sid].data.length);
@@ -198,16 +211,14 @@ var ChartComponent = function (_React$Component) {
   }, {
     key: 'renderChart',
     value: function renderChart() {
-      var _props3 = this.props,
-          data = _props3.data,
-          options = _props3.options,
-          legend = _props3.legend,
-          type = _props3.type,
-          redraw = _props3.redraw;
+      var _props2 = this.props,
+          options = _props2.options,
+          legend = _props2.legend,
+          type = _props2.type,
+          redraw = _props2.redraw;
 
       var node = _reactDom2.default.findDOMNode(this);
-
-      this.memoizeDataProps();
+      var data = this.memoizeDataProps();
 
       this.chart_instance = new _chart2.default(node, {
         type: type,
@@ -218,10 +229,10 @@ var ChartComponent = function (_React$Component) {
   }, {
     key: 'render',
     value: function render() {
-      var _props4 = this.props,
-          height = _props4.height,
-          width = _props4.width,
-          onElementsClick = _props4.onElementsClick;
+      var _props3 = this.props,
+          height = _props3.height,
+          width = _props3.width,
+          onElementsClick = _props3.onElementsClick;
 
 
       return _react2.default.createElement('canvas', {
@@ -236,7 +247,7 @@ var ChartComponent = function (_React$Component) {
 }(_react2.default.Component);
 
 ChartComponent.propTypes = {
-  data: _react.PropTypes.object.isRequired,
+  data: _react.PropTypes.oneOfType([_react.PropTypes.object, _react.PropTypes.func]).isRequired,
   getDatasetAtEvent: _react.PropTypes.func,
   getElementAtEvent: _react.PropTypes.func,
   getElementsAtEvent: _react.PropTypes.func,

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-chartjs-2",
-  "version": "2.0.0",
+  "version": "2.0.4",
   "description": "react-chartjs-2",
   "main": "lib/index.js",
   "author": "Goran Udosic",

src/index.js

@@ -90,19 +90,17 @@ class ChartComponent extends React.Component {
   }
 
   transformDataProp() {
-    const { dataProp } = this.props;
+    const { data } = this.props;
     const node = ReactDOM.findDOMNode(this);
-    return (typeof(dataProp) == "function") ? dataProp(node) : dataProp;
+    return (typeof(data) == "function") ? data(node) : data;
   }
 
   // Chart.js directly mutates the data.dataset objects by adding _meta proprerty
   // this makes impossible to compare the current and next data changes
   // therefore we memoize the data prop while sending a fake to Chart.js for mutation.
   // see https://github.com/chartjs/Chart.js/blob/master/src/core/core.controller.js#L615-L617
   memoizeDataProps() {
-    const { dataProp } = this.props;
-
-    if (!dataProp) {
+    if (!this.props.data) {
       return;
     }
 
@@ -131,7 +129,7 @@ class ChartComponent extends React.Component {
     // seamless transitions
     let currentDatasets = (this.chart_instance.config.data && this.chart_instance.config.data.datasets) || [];
     const nextDatasets = data.datasets || [];
-		
+
 		// Prevent charting of legend items that no longer exist
     while (currentDatasets.length > nextDatasets.length) {
       currentDatasets.pop();
@@ -170,7 +168,6 @@ class ChartComponent extends React.Component {
   renderChart() {
     const {options, legend, type, redraw} = this.props;
     const node = ReactDOM.findDOMNode(this);
-
     const data = this.memoizeDataProps();
 
     this.chart_instance = new Chart(node, {