ng2-google-charts
TypeScript icon, indicating that this package has built-in type declarations

7.0.0 • Public • Published

ng2-google-charts

Angular Google Charts module

NPM Version Downloads

Versions

  • Version 6 is built with Angular 9, should work with Angular versions from 8 to 13.
  • Version 7 is built with Angular 12 in Ivy partial compilation mode, works with Angular versions from 12 to 13.

Features

  • All chart types
  • Dashboard and controls
  • Chart Editor
  • Formatters
  • Events

Sponsoring

If you are using this package commercially or if you find it useful, please consider sponsoring this project.

Install

npm i --save ng2-google-charts

Quick start

Import the module in your app.module.ts:

import { Ng2GoogleChartsModule } from 'ng2-google-charts';

@NgModule({
  ...
  imports: [
    ...
    Ng2GoogleChartsModule,
  ],
  providers: [
})
export class AppModule { }

In your templates, use the google-chart component like this:

<google-chart [data]="pieChart"></google-chart>

and in the corresponding .ts file:

import { GoogleChartInterface, GoogleChartType } from 'ng2-google-charts';

public pieChart: GoogleChartInterface = {
  chartType: GoogleChartType.PieChart,
  dataTable: [
    ['Task', 'Hours per Day'],
    ['Work',     11],
    ['Eat',      2],
    ['Commute',  2],
    ['Watch TV', 2],
    ['Sleep',    7]
  ],
  //firstRowIsData: true,
  options: {'title': 'Tasks'},
};

Usage & Demo

Check out the reference documentation and the live demo.

License

MIT

Package Sidebar

Install

Weekly Downloads

8,022

Version

7.0.0

License

MIT

Unpacked Size

381 kB

Total Files

40

Last publish

Collaborators

  • gmazzamuto