Official Angular 2 plugin for amCharts V3, fix ng server error Module build failed: TypeError: Cannot read property 'text' of undefined
npm install amcharts3-angular2-fix-errorOfficial Angular plugin for amCharts V3
Installation
============
``
npm install amcharts/amcharts3-angular2 --save
How to use
==========
1) In your HTML file, load the amCharts library using
`
----
2) In your app module, import the AmChartsModule module and add it to the imports:
`js
import { AmChartsModule } from "amcharts3-angular2";
@NgModule({
imports: [
AmChartsModule
]
})
export class AppModule {}
`
----
3) Inject the AmChartsService into your app component, create a
element with an id, then use the makeChart method to create the chart:`js
import { AmChartsService } from "amcharts3-angular2";@Component({
template:
})
export class AppComponent {
private chart: any; constructor(private AmCharts: AmChartsService) {}
ngOnInit() {
this.chart = this.AmCharts.makeChart("chartdiv", {
"type": "serial",
"theme": "light",
"dataProvider": []
...
});
}
ngOnDestroy() {
this.AmCharts.destroyChart(this.chart);
}
}
The first argument to
must be the same as the 's id. The id can be whatever you want, but if you display multiple charts each chart must have a different idWhen you are finished with the chart, you must call the
method. It's good to put this inside the ngOnDestroy method.----
5) If you want to change the chart after the chart has been created, you must make the changes using the
updateChart method:`js
// This must be called when making any changes to the chart
this.AmCharts.updateChart(this.chart, () => {
// Change whatever properties you want, add event listeners, etc.
this.chart.dataProvider = []; this.chart.addListener("init", () => {
// Do stuff after the chart is initialized
});
});
`----
You can see some examples in the
directory.Changelog
$3
* Adding in support for Angular 4
* Deprecating the element in favor of the new AmChartsService`