Awesome
I'm joining vue-chartjs as a core maintainer so this package will be kept just for those who already use it. I'm encouraging new users to use vue-chartjs instead
📊 Chart.js 3 for Vue 2 and Vue 3
<p align="center"> <a href='https://sgts.netlify.com/'> <img width='100' src="https://raw.githubusercontent.com/victorgarciaesgi/vue-chart-3/main/media/logo.svg" alt="sgts logo"> </a> </p> <div align='center'><a href=''>
</a>
<a href=''>
</a>
<a href=''>
</a>
<img src='https://img.shields.io/npm/l/vue-chart-3.svg'>
This package is a rewrite of vue-chartjs for Chart.js 3, but written in Typescript with Vue 3 composition api in mind.
Vite.jsandNuxt 3compatible 💯.
Documentation
Installation
For Vue 3
npm i vue-chart-3 chart.js
#or
yarn add vue-chart-3 chart.js
#or
pnpm i vue-chart-3 chart.js
For Vue 2
npm i vue-chart-3@legacy chart.js
#or
yarn add vue-chart-3@legacy chart.js
#or
pnpm i vue-chart-3@legacy chart.js
Important notes
Using with Vue 3 or Vue 2
This package works with version 2.x and 3.x of Vue.
- Vue 3 works out-of-the-box
- Vue 2 requires
@vue/composition-apipackage to also be installed and registered, to provide Vue 3's Composition API features likeref, defineComponent, computed, reactive.
Demos
- Vue 3: CodeSandbox demo Vue 3
- Vue 2 + composition API: CodeSandbox demo Vue 2 + composition
- Vue 2 + Typescript + class API CodeSandox demo Vue 2 + class
- Nuxt 2 + SSR CodeSandbox demo Nuxt 2 + SSR