# Awesome Chart.js [![Awesome](https://awesome.re/badge-flat2.svg)](https://awesome.re) A curated list of awesome things related to [Chart.js](https://www.chartjs.org) v2+ - [Resources](#resources) - [Charts](#charts) - [Plugins](#plugins) - [Adapters](#adapters) - [Integrations](#integrations) ## Resources - [Official Guide](https://chartjs.org/docs) - The user guide and documentation site. ## Charts - [bar-funnel](https://github.com/chartjs/Chart.BarFunnel.js) - Adds bar funnel chart type. - [boxplot](https://github.com/sgratzl/chartjs-chart-boxplot) - Adds boxplot and violin plot chart type. - [error-bars](https://github.com/sgratzl/chartjs-chart-error-bars) - Adds diverse error bar variants of standard chart types. - [financial](https://github.com/chartjs/chartjs-chart-financial) - Adds financial chart types such as a candlestick. - [geo](https://github.com/sgratzl/chartjs-chart-geo) - Adds geographic map chart types such as choropleth and bubble map. - [graph](https://github.com/sgratzl/chartjs-chart-graph) - Adds graph chart types such as a force directed graph. - [matrix](https://github.com/kurkle/chartjs-chart-matrix) - Adds matrix chart type. - [pcp](https://github.com/sgratzl/chartjs-chart-pcp) - Adds parallel coordinates plot chart type. - [sankey](https://github.com/kurkle/chartjs-chart-sankey) - Adds sankey diagram chart type. - [smith](https://github.com/chartjs/Chart.smith.js) - Adds smith chart type. - [treemap](https://github.com/kurkle/chartjs-chart-treemap) - Adds treemap chart type. - [venn](https://github.com/upsetjs/chartjs-chart-venn) - Adds venn and euler chart type. - [word-cloud](https://github.com/sgratzl/chartjs-chart-wordcloud) - Adds word-cloud chart type. ## Plugins - [annotation](https://github.com/chartjs/chartjs-plugin-annotation) - Draws lines and boxes on the chart area. - [colorschemes](https://github.com/nagix/chartjs-plugin-colorschemes) - Enables automatic coloring using predefined color schemes. - [crosshair](https://github.com/abelheinsbroek/chartjs-plugin-crosshair) - Adds a data crosshair to line and scatter charts. - [datalabels](https://github.com/chartjs/chartjs-plugin-datalabels) - Displays labels on data for any type of charts. - [datasource-prometheus](https://github.com/samber/chartjs-plugin-datasource-prometheus) - Displays time-series from Prometheus. - [deferred](https://github.com/chartjs/chartjs-plugin-deferred) - Defers initial chart update until chart scrolls into viewport. - [dragdata](https://github.com/chrispahm/chartjs-plugin-dragdata) - Lets users drag data points on the chart. - [hierarchical](https://github.com/sgratzl/chartjs-plugin-hierarchical) - Adds support for hierarchical categorical scales that can be collapsed, expanded, and focused. - [regression](https://github.com/pomgui/chartjs-plugin-regression) - Calculate and draw statistical linear, exponential, power, logarithmic, and polynomial regressions (trend lines) - [rough](https://github.com/nagix/chartjs-plugin-rough) - Draws charts in a sketchy, hand-drawn-like style using Rough.js. - [stacked100](https://github.com/y-takey/chartjs-plugin-stacked100) - Draws 100% stacked bar chart. - [streaming](https://github.com/nagix/chartjs-plugin-streaming) - Adds support for live streaming data. - [style](https://github.com/nagix/chartjs-plugin-style) - Provides styling options such as shadow, bevel, glow or overlay effects. - [waterfall](https://github.com/everestate/chartjs-plugin-waterfall) - Enables easy use of waterfall charts. - [zoom](https://github.com/chartjs/chartjs-plugin-zoom) - Enables zooming and panning on charts. In addition, many plugins can be found on the [npm registry](https://www.npmjs.com/search?q=chartjs-plugin-). ## Adapters - [date-fns](https://github.com/chartjs/chartjs-adapter-date-fns) - date-fns adapter - [luxon](https://github.com/chartjs/chartjs-adapter-luxon) - Luxon adapter - [moment](https://github.com/chartjs/chartjs-adapter-moment) - Moment.js adapter ## Integrations ### JavaScript - [angular2-chartjs](https://github.com/emn178/angular2-chartjs) - Angular v2+ - [ember-cli-chart](https://github.com/aomran/ember-cli-chart) - Ember CLI - [lwcc](https://github.com/SalesforceLabs/LightningWebChartJS) - Lightning Web Component - [ng2-charts](https://github.com/valor-software/ng2-charts) - Angular v2+ - [omi-chart](https://github.com/Tencent/omi/tree/master/packages/omi-chart) - Omi - [react-chartjs-2](https://github.com/jerairrest/react-chartjs-2) - React - [vue-chartjs](https://github.com/apertureless/vue-chartjs/) - Vue.js ### Others - [charba](https://github.com/pepstock-org/Charba) - GWT - [chart.java](https://github.com/mdewilde/chart/) - Java - [chartjs-ocaml](https://github.com/monstasat/chartjs-ocaml) - OCaml - [chartjs-ror](https://github.com/airblade/chartjs-ror) - Ruby on Rails - [django-chartjs](https://github.com/peopledoc/django-chartjs) - Django - [ipychart](https://github.com/nicohlr/ipychart) - Jupyter Notebook - [laravel-chartjs](https://github.com/fxcosta/laravel-chartjs) - Laravel - [liquify](https://github.com/sakos95/liquify) - Fast, multi-threaded visualization of stream data with Angular - [nova-chartjs](https://github.com/coroo/nova-chartjs) - Laravel Nova - [quickchart](https://github.com/typpo/quickchart) - Web API for static charts - [wicked-charts](https://github.com/adessoAG/wicked-charts) - Java