Socket
Socket
Sign inDemoInstall

angular2-chartjs

Package Overview
Dependencies
12
Maintainers
1
Versions
12
Alerts
File Explorer

Advanced tools

Install Socket

Detect and block malicious and high-risk dependencies

Install

    angular2-chartjs

Chart.js component for Angular2


Version published
Maintainers
1
Install size
5.37 MB
Created

Changelog

Source

v0.5.1 / 2018-05-18

Improve

  • performance

Readme

Source

angular2-chartjs

Chart.js component for Angular2+

Installation

You can install angular2-chartjs by using npm.

npm install angular2-chartjs

Usage

Add ChartModule to your module, eg.

import { ChartModule } from 'angular2-chartjs';

@NgModule({
  imports: [ ChartModule ]
  // ...
})
export class AppModule {
}

And you can use selector chart in your template.

JavaScript

type = 'line';
data = {
  labels: ["January", "February", "March", "April", "May", "June", "July"],
  datasets: [
    {
      label: "My First dataset",
      data: [65, 59, 80, 81, 56, 55, 40]
    }
  ]
};
options = {
  responsive: true,
  maintainAspectRatio: false
};

HTML

<chart [type]="type" [data]="data" [options]="options"></chart>

Options

[type]

string, required
Chart type.

[data]

object, required
To display data, the chart must be passed a data object that contains all of the information needed by the chart. See.

[options]

object, optional
To create a chart with configuration options, simply pass an object containing your configuration to the constructor. See.

Events

(clickCanvas)

Event
Return click event.

(clickDataset)

Array
Return the clicked dataset array.

(clickElement)

Array
Return the clicked element in array.

(clickElements)

Array
Return the clicked elements in array.

Members

chart

Chart
Chart instance. You can call Chart.js methods via this member.

Example:

chartComponent.chart.destroy();

SystemJs

Add following settings

{
  map: {
    'angular2-chartjs': 'npm:angular2-chartjs',
    'chart.js': 'npm:chart.js/dist/Chart.bundle.js'
  },
  packages: {
    'angular2-chartjs': {
      main: './dist/index.js',
      defaultExtension: 'js'
    }
  }
}

FAQ

How to call Chart.js methods - #7, #2

License

The project is released under the MIT license.

Contact

The project's website is located at https://github.com/emn178/angular2-chartjs
Author: Chen, Yi-Cyuan (emn178@gmail.com)

Keywords

FAQs

Last updated on 18 May 2018

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install

Related posts

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc