Chartjs-Angular 5 reset chart js bar in same component

by

3👍

✅

You have to get the 2d context.

Template : 

<div class="chart-container" fxFlex="80">
      <canvas id="currency"></canvas>
</div>

Component: 

  private displayCurrencyGraph(currencyEntry: CurrencyEntry) {
    const currencyCanvas: any = document.getElementById('currency');
    const currencyCanvasContext = currencyCanvas.getContext('2d');
    ChartBuilder.buildChartLine(currencyCanvasContext,this.data );
  }

ChartBuilder:

static buildChartLine(canvasContext, data){
    new Chart(canvasContext, {
      type: 'line',
      data: {data} 
}

From your code, you are missing getContext('2d') call from your canvas. If you add that, it should work.

You must call destroy() method on context and then assign new dataset.

Leave a comment