KO
|
EN
gitlite โ search
Search
#python
#javascript
#nodejs
#frontend
#golang
#android
#deep-learning
#vue
#docker
#python3
#arduino
#multithreading
angular2-chartjs
โ 95
Open GitHub โ
Chart.js component for Angular2
Download README (.md)
Explore Similar Repositories
datetimepicker
:
๐ Date and Time Picker
lb-controller
:
Load Balancer for Rancher services via ingress controllers backed up by a Load Balancer provider of choice
airbrake-ruby
:
A plain Ruby Airbrake notifier
fishline
:
A powerline prompt framework for the fish-shell built in fish-shell.
CoverTree
:
Cover Tree implementation in C++ for k-Nearest Neighbours and range search
// repository documentation
Was this content helpful?
โ 0
(0 ratings)
Select Rating:
โ
โ
โ
โ
โ
Submit Feedback
Recent Feedback
×
Download README
Do you want to download the
README.md
file for
angular2-chartjs
?
Download (.md)
# 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. ```JavaScript import { ChartModule } from 'angular2-chartjs'; @NgModule({ imports: [ ChartModule ] // ... }) export class AppModule { } ``` And you can use selector `chart` in your template. JavaScript ```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 ```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](http://www.chartjs.org/docs/#chart-configuration-chart-data). ### [options] *object*, optional To create a chart with configuration options, simply pass an object containing your configuration to the constructor. [See](http://www.chartjs.org/docs/#chart-configuration-creating-a-chart-with-options). ## 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: ```JavaScript chartComponent.chart.destroy(); ``` ## SystemJs Add following settings ```JavaScript { 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](https://github.com/emn178/angular2-chartjs/issues/7), [#2](https://github.com/emn178/angular2-chartjs/issues/2) ## License The project is released under the [MIT license](http://www.opensource.org/licenses/MIT). ## Contact The project's website is located at https://github.com/emn178/angular2-chartjs Author: Chen, Yi-Cyuan (emn178@gmail.com)
