https://github.com/xerox563/chartjs
Chart.js is a lightweight, flexible, and responsive JavaScript library for creating beautiful and interactive charts 🎨📈. It supports line, bar, radar, pie, doughnut, polar area, bubble, and scatter charts with smooth animations and customization options.
https://github.com/xerox563/chartjs
barchart chartjs chartjs-2 javascript pie-chart reactjs
Last synced: 3 months ago
JSON representation
Chart.js is a lightweight, flexible, and responsive JavaScript library for creating beautiful and interactive charts 🎨📈. It supports line, bar, radar, pie, doughnut, polar area, bubble, and scatter charts with smooth animations and customization options.
- Host: GitHub
- URL: https://github.com/xerox563/chartjs
- Owner: Xerox563
- Created: 2025-02-07T01:28:45.000Z (over 1 year ago)
- Default Branch: master
- Last Pushed: 2025-02-07T02:03:19.000Z (over 1 year ago)
- Last Synced: 2025-02-26T22:18:28.190Z (over 1 year ago)
- Topics: barchart, chartjs, chartjs-2, javascript, pie-chart, reactjs
- Language: JavaScript
- Homepage:
- Size: 45.9 KB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# 📊 Chart.js - Simple Yet Powerful JavaScript Charting Library
Chart.js is a **lightweight, flexible, and responsive** JavaScript library for creating **beautiful and interactive charts** 🎨📈. It supports multiple chart types with smooth animations and extensive customization options.
## ✨ Features
- ✅ Easy to use & well-documented 📖
- ✅ Highly customizable 🎨
- ✅ Supports animations & tooltips 🎭
- ✅ Works with React, Vue, and Vanilla JS ⚡
- ✅ Responsive & scalable 📏
- ✅ Supports multiple datasets 📊
## 🚀 Installation
### Using npm:
```sh
npm install chart.js
```
### Using CDN:
```html
```
## 🔧 Usage
### Basic Example
```html
const ctx = document.getElementById('myChart').getContext('2d');
const myChart = new Chart(ctx, {
type: 'bar',
data: {
labels: ['Red', 'Blue', 'Yellow', 'Green', 'Purple', 'Orange'],
datasets: [{
label: '# of Votes',
data: [12, 19, 3, 5, 2, 3],
backgroundColor: [
'rgba(255, 99, 132, 0.2)',
'rgba(54, 162, 235, 0.2)',
'rgba(255, 206, 86, 0.2)',
'rgba(75, 192, 192, 0.2)',
'rgba(153, 102, 255, 0.2)',
'rgba(255, 159, 64, 0.2)'
],
borderColor: [
'rgba(255, 99, 132, 1)',
'rgba(54, 162, 235, 1)',
'rgba(255, 206, 86, 1)',
'rgba(75, 192, 192, 1)',
'rgba(153, 102, 255, 1)',
'rgba(255, 159, 64, 1)'
],
borderWidth: 1
}]
},
options: {
scales: {
y: {
beginAtZero: true
}
}
}
});
```
## 📚 Documentation
For more details, visit the **[official documentation](https://www.chartjs.org/docs/latest/)**.
## 🎨 Available Chart Types
- 📈 Line Chart
- 📊 Bar Chart
- 🍩 Doughnut Chart
- 🥧 Pie Chart
- 📡 Radar Chart
- 🎯 Polar Area Chart
- ⚡ Scatter & Bubble Charts
## 🌟 Contributing
Contributions are welcome! Feel free to open issues or submit pull requests.
## 📜 License
This project is licensed under the **MIT License**.
## ⭐ Show Some Love
If you found this useful, **star the repository** ⭐ and share it! 🚀