Accessing char.js prototype methods

[Methodician]

I'm not sure if you've got a reliable way to access the chart methods such as .destroy() and .update() as described here: http://www.chartjs.org/docs/#advanced-usage-prototype-methods

If so, a little documentation would rock.

If not, it would be a great feature that would really make this tool worth while!

[emn178]

Hi, v0.1.5 exposed chart instance to public. You can use ViewChild or local variable to access it.

[Methodician]

Thanks for the update!

FWIW and if anyone else wants an easy hack - I got around my particular issue (updating the chart with changing data) simply by wrapping the containing div in an *ngIf and having it removed from and re-added to the DOM each time the data changed. It sounds inefficient but there is no perceptible delay and it was ridiculously easy.

None the less, I'm sure I'll find other reasons to access the chart instance. Great tool @emn178 ! Nice and flexible. Love it when people don't go too far - this allows for lots of customization without making get-going hard.

[Standaa]

@emn178 Thanks for the library, it's a good relief after ng2-charts...
How do you precisely get a hold on the chart instance in the view child ?
Tried to do this :
import { ChartModule } from 'angular2-chartjs';
@ViewChild(ChartModule) chart: ChartModule;
And this.chart.update();
But I get a property does not exist on ChartModule error.

Thanks !

[emn178]

You should use ChartComponent

import { ChartComponent } from 'angular2-chartjs';

//...

@ViewChild(ChartComponent) chart: ChartComponent; 

//...

this.chart.chart.update();

[Standaa]

Thanks ! My bad for not deep diving in the library's code.
Everything is running smoothly on angular-cli. No fix, no hack nothing.
I wish I had gone for this lib in the first place.

[shyamal890]

But lets say there are 4 charts on display would this.chart.chart.update(); update them all?

[MeghaKumari2203]

import { ChartComponent } from 'angular2-chartjs';
//...
@ViewChild(ChartComponent) chart: ChartComponent;
//...
this.chart.chart.update();

It's not working on my ionic 3 project.
I am getting an error: TypeError : this.chart is undefined.
Somebody,please help.

[emn178]

@MeghaKumari2203 more detail info please

[jmbrosa]

import { ChartComponent } from 'angular2-chartjs';
//...
@ViewChild(ChartComponent) chart: ChartComponent;
//...
this.chart.chart.update();

I'm using Angular 5 and tried the ViewChild to get my ChartComponent.

When I try to get the this.chart is undefined. I set correctly the options, the datasets are ok and the chart appears!

The main goal to use the ChartComponent will be to use the native method generateLegend() of chartjs. Because I created a customize html legend. Anyone can help me?

Example: this.chart.chart.generateLegend() <- I want only use this

[emn178]

when do you call this.chart, maybe it's not ready

[jmbrosa]

when do you call this.chart, maybe it's not ready

I thought on this case, but I call this.chart after load all chart content

[emn178]

post your sample code?

[jmbrosa]

Solve it! I used in Angular the ngAfterViewChecked and this.chart.chart.generateLegend() works.

Many thanks