mirror of
https://github.com/chartjs/Chart.js.git
synced 2024-10-06 04:09:08 +02:00
Revamp the README.md and add link to the awesome list (#6096)
Integrate the upcoming awesome list and make our README.md welcome page more user friendly by displaying the Chart.js logo, adding the docs TOC and removing instructions that was already in the docs.
This commit is contained in:
Simon Brunel
GitHub
parent
93f4e6e4e8
commit
b2f7adc2b4
67
README.md
67
README.md
@ -1,56 +1,31 @@
|
||||
# Chart.js
|
||||
<p align="center">
|
||||
<img src="https://www.chartjs.org/media/logo-title.svg"><br/>
|
||||
Simple yet flexible JavaScript charting for designers & developers
|
||||
</p>
|
||||
|
||||
[](https://travis-ci.org/chartjs/Chart.js) [](https://coveralls.io/github/chartjs/Chart.js?branch=master) [](https://codeclimate.com/github/chartjs/Chart.js) [](https://chartjs-slack.herokuapp.com/)
|
||||
|
||||
*Simple HTML5 Charts using the canvas element* [chartjs.org](https://www.chartjs.org)
|
||||
|
||||
## Installation
|
||||
|
||||
You can download the latest version of Chart.js from the [GitHub releases](https://github.com/chartjs/Chart.js/releases/latest) or use a [Chart.js CDN](https://cdnjs.com/libraries/Chart.js).
|
||||
|
||||
To install via npm:
|
||||
|
||||
```bash
|
||||
npm install chart.js --save
|
||||
```
|
||||
|
||||
To install via bower:
|
||||
```bash
|
||||
bower install chart.js --save
|
||||
```
|
||||
|
||||
### Selecting the Correct Build
|
||||
|
||||
Chart.js provides two different builds for you to choose: `Stand-Alone Build`, `Bundled Build`.
|
||||
|
||||
#### Stand-Alone Build
|
||||
Files:
|
||||
* `dist/Chart.js`
|
||||
* `dist/Chart.min.js`
|
||||
|
||||
The stand-alone build includes Chart.js as well as the color parsing library. If this version is used, you are required to include [Moment.js](https://momentjs.com/) before Chart.js for the functionality of the time axis.
|
||||
|
||||
#### Bundled Build
|
||||
Files:
|
||||
* `dist/Chart.bundle.js`
|
||||
* `dist/Chart.bundle.min.js`
|
||||
|
||||
The bundled build includes Moment.js in a single file. You should use this version if you require time axes and want to include a single file. You should not use this build if your application already included Moment.js. Otherwise, Moment.js will be included twice which results in increasing page load time and possible version compatibility issues. The Moment.js version in the bundled build is private to Chart.js so if you want to use Moment.js yourself, it's better to use Chart.js (non bundled) and import Moment.js manually.
|
||||
<p align="center">
|
||||
<a href="https://www.chartjs.org/docs/latest/getting-started/installation.html"><img src="https://img.shields.io/github/release/chartjs/Chart.js.svg?style=flat-square&maxAge=600" alt="Downloads"></a>
|
||||
<a href="https://travis-ci.org/chartjs/Chart.js"><img src="https://img.shields.io/travis/chartjs/Chart.js.svg?style=flat-square&maxAge=600" alt="Builds"></a>
|
||||
<a href="https://coveralls.io/github/chartjs/Chart.js?branch=master"><img src="https://img.shields.io/coveralls/chartjs/Chart.js.svg?style=flat-square&maxAge=600" alt="Coverage"></a>
|
||||
<a href="https://github.com/chartjs/awesome"><img src="https://awesome.re/badge-flat2.svg" alt="Awesome"></a>
|
||||
<a href="https://chartjs-slack.herokuapp.com/"><img src="https://img.shields.io/badge/slack-chartjs-blue.svg?style=flat-square&maxAge=3600" alt="Slack"></a>
|
||||
</p>
|
||||
|
||||
## Documentation
|
||||
|
||||
You can find documentation at [www.chartjs.org/docs](https://www.chartjs.org/docs). The markdown files that build the site are available under `/docs`. Previous version documentation is available at [www.chartjs.org/docs/latest/developers/#previous-versions](https://www.chartjs.org/docs/latest/developers/#previous-versions).
|
||||
- [Introduction](https://www.chartjs.org/docs/latest/)
|
||||
- [Getting Started](https://www.chartjs.org/docs/latest/getting-started/)
|
||||
- [General](https://www.chartjs.org/docs/latest/general/)
|
||||
- [Configuration](https://www.chartjs.org/docs/latest/configuration/)
|
||||
- [Charts](https://www.chartjs.org/docs/latest/charts/)
|
||||
- [Axes](https://www.chartjs.org/docs/latest/axes/)
|
||||
- [Developers](https://www.chartjs.org/docs/latest/developers/)
|
||||
- [Popular Extensions](https://github.com/chartjs/awesome)
|
||||
- [Samples](https://www.chartjs.org/samples/)
|
||||
|
||||
## Contributing
|
||||
|
||||
Before submitting an issue or a pull request, please take a moment to look over the [contributing guidelines](https://github.com/chartjs/Chart.js/blob/master/docs/developers/contributing.md) first. For support using Chart.js, please post questions with the [`chartjs` tag on Stack Overflow](https://stackoverflow.com/questions/tagged/chartjs).
|
||||
|
||||
## Building
|
||||
Instructions on building and testing Chart.js can be found in [the documentation](https://github.com/chartjs/Chart.js/blob/master/docs/developers/contributing.md#building-and-testing).
|
||||
|
||||
## Thanks
|
||||
- [BrowserStack](https://browserstack.com) for allowing our team to test on thousands of browsers.
|
||||
- [@n8agrin](https://twitter.com/n8agrin) for the Twitter handle donation.
|
||||
Instructions on building and testing Chart.js can be found in [the documentation](https://github.com/chartjs/Chart.js/blob/master/docs/developers/contributing.md#building-and-testing). Before submitting an issue or a pull request, please take a moment to look over the [contributing guidelines](https://github.com/chartjs/Chart.js/blob/master/docs/developers/contributing.md) first. For support, please post questions on [Stack Overflow](https://stackoverflow.com/questions/tagged/chartjs) with the `chartjs` tag.
|
||||
|
||||
## License
|
||||
|
||||
|
||||
@ -51,5 +51,5 @@
|
||||
* [Contributing](developers/contributing.md)
|
||||
* [Additional Notes](notes/README.md)
|
||||
* [Comparison Table](notes/comparison.md)
|
||||
* [Popular Extensions](notes/extensions.md)
|
||||
* [Popular Extensions](https://github.com/chartjs/awesome)
|
||||
* [License](notes/license.md)
|
||||
|
||||
@ -1,72 +0,0 @@
|
||||
# Popular Extensions
|
||||
|
||||
Many extensions can be found on the [Chart.js GitHub organization](https://github.com/chartjs) or on the [npm registry](https://www.npmjs.com/search?q=chartjs-).
|
||||
|
||||
## Charts
|
||||
|
||||
- <a href="https://github.com/chartjs/chartjs-chart-financial" target="_blank">chartjs-chart-financial</a> - Adds financial chart types such as a candlestick.
|
||||
- <a href="https://github.com/chartjs/Chart.BarFunnel.js" target="_blank">Chart.BarFunnel.js</a> - Adds a bar funnel chart type.
|
||||
- <a href="https://github.com/chartjs/Chart.LinearGauge.js" target="_blank">Chart.LinearGauge.js</a> - Adds a linear gauge chart type.
|
||||
- <a href="https://github.com/chartjs/Chart.smith.js" target="_blank">Chart.Smith.js</a> - Adds a smith chart type.
|
||||
|
||||
In addition, many charts can be found on the [npm registry](https://www.npmjs.com/search?q=chartjs-chart-).
|
||||
|
||||
## Plugins
|
||||
|
||||
- <a href="https://github.com/chartjs/chartjs-plugin-annotation" target="_blank">chartjs-plugin-annotation</a> - Draws lines and boxes on chart area.
|
||||
- <a href="https://github.com/nagix/chartjs-plugin-colorschemes" target="_blank">chartjs-plugin-colorschemes</a> - Enables automatic coloring using predefined color schemes.
|
||||
- <a href="https://github.com/abelheinsbroek/chartjs-plugin-crosshair" target="_blank">chartjs-plugin-crosshair</a> - Adds a data crosshair to line and scatter charts
|
||||
- <a href="https://github.com/chartjs/chartjs-plugin-datalabels" target="_blank">chartjs-plugin-datalabels</a> - Displays labels on data for any type of charts.
|
||||
- <a href="https://github.com/chartjs/chartjs-plugin-deferred" target="_blank">chartjs-plugin-deferred</a> - Defers initial chart update until chart scrolls into viewport.
|
||||
- <a href="https://github.com/compwright/chartjs-plugin-draggable" target="_blank">chartjs-plugin-draggable</a> - Makes select chart elements draggable with the mouse.
|
||||
- <a href="https://github.com/nagix/chartjs-plugin-rough" target="_blank">chartjs-plugin-rough</a> - Draws charts in a sketchy, hand-drawn-like style.
|
||||
- <a href="https://github.com/y-takey/chartjs-plugin-stacked100" target="_blank">chartjs-plugin-stacked100</a> - Draws 100% stacked bar chart.
|
||||
- <a href="https://github.com/nagix/chartjs-plugin-streaming" target="_blank">chartjs-plugin-streaming</a> - Enables to create live streaming charts.
|
||||
- <a href="https://github.com/nagix/chartjs-plugin-style" target="_blank">chartjs-plugin-style</a> - Provides more styling options.
|
||||
- <a href="https://github.com/everestate/chartjs-plugin-waterfall" target="_blank">chartjs-plugin-waterfall</a> - Enables easy use of waterfall charts.
|
||||
- <a href="https://github.com/chartjs/chartjs-plugin-zoom" target="_blank">chartjs-plugin-zoom</a> - 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-).
|
||||
|
||||
## Integrations
|
||||
|
||||
### Angular (v2+)
|
||||
|
||||
- <a href="https://github.com/emn178/angular2-chartjs" target="_blank">emn178/angular2-chartjs</a>
|
||||
- <a href="https://github.com/valor-software/ng2-charts" target="_blank">valor-software/ng2-charts</a>
|
||||
|
||||
### Angular (v1)
|
||||
- <a href="https://github.com/jtblin/angular-chart.js" target="_blank">angular-chart.js</a>
|
||||
- <a href="https://github.com/carlcraig/tc-angular-chartjs" target="_blank">tc-angular-chartjs</a>
|
||||
- <a href="https://github.com/petermelias/angular-chartjs" target="_blank">angular-chartjs</a>
|
||||
- <a href="https://github.com/earlonrails/angular-chartjs-directive" target="_blank">Angular Chart-js Directive</a>
|
||||
|
||||
### React
|
||||
- <a href="https://github.com/topdmc/react-chartjs2" target="_blank">react-chartjs2</a>
|
||||
- <a href="https://github.com/gor181/react-chartjs-2" target="_blank">react-chartjs-2</a>
|
||||
|
||||
### Django
|
||||
- <a href="https://github.com/matthisk/django-jchart" target="_blank">Django JChart</a>
|
||||
- <a href="https://github.com/novafloss/django-chartjs" target="_blank">Django Chartjs</a>
|
||||
|
||||
### Ruby on Rails
|
||||
- <a href="https://github.com/airblade/chartjs-ror" target="_blank">chartjs-ror</a>
|
||||
|
||||
### Laravel
|
||||
- <a href="https://github.com/fxcosta/laravel-chartjs" target="_blank">laravel-chartjs</a>
|
||||
|
||||
### Vue.js
|
||||
- <a href="https://github.com/apertureless/vue-chartjs/" target="_blank">vue-chartjs</a>
|
||||
|
||||
### Java
|
||||
- <a href="https://github.com/mdewilde/chart/" target="_blank">Chart.java</a>
|
||||
- <a href="https://github.com/adessoAG/wicked-charts" target="_blank">Wicked-Charts</a>
|
||||
|
||||
### GWT (Google Web toolkit)
|
||||
- <a href="https://github.com/pepstock-org/Charba" target="_blank">Charba</a>
|
||||
|
||||
### Ember.js
|
||||
- <a href="https://github.com/aomran/ember-cli-chart" target="_blank">ember-cli-chart</a>
|
||||
|
||||
### Omi (v5+)
|
||||
- <a href="https://github.com/Tencent/omi/tree/master/packages/omi-chart" target="_blank">omi-chart</a>
|
||||
Loading…
Reference in New Issue
Block a user