stevenmiller888 / deku-chart

Chart component for Deku

deku-chart

A chart component built with Deku and Chart.js.

Installation

$ npm install deku-chart

Usage

<Chart type="Bar">
  {
    {
      January:  [65, 28],
      February: [59, 48],
      March:    [80, 40],
      April:    [81, 19],
      May:      [56, 86],
      June:     [55, 27],
      July:     [40, 90]
    }
  }
</Chart>

License

MIT

deku-chart's Issues

Multiple Chart instances

I tried to do something similar to this library earlier but ended up with the issue that every time the component is rendered again it creates a new chart instance without destroying the old on first.

From the look of it, your code has this problem as well.

The way I solved it was by creating a chartManager:

function createChartManager() {
  let chart;
  return (ctx, type, info) => {
    if(chart) {
      chart.destroy();
      chart = null;
    }
    chart = new Chart(ctx)[type](info);
  };
}

Then create a new chart manager for the component when it's initialized (I used the initialState function) and just call state.chart(ctx, type, info) whenever you need to update the chart.