vue-chart-js
Chart.js wrapper component based on Vue.
Works with Vue 2.*
Installation
Install via CDN
Install via NPM
$ npm install vue-chart-js --save
Register as Component
name: 'App' components: VueChart
Register as Plugin
Vue
Usage
<template> <vue-chart type="bar" :data="chartData"></vue-chart></template> <script>import VueChart from 'vue-chart-js' export default { name: 'App', components: { VueChart }, data: () => ({ chartData: { labels: ['Item 1', 'Item 2', 'Item 3'], datasets: [ { label: 'Component 1', data: [10, 20, 30] }, { label: 'Component 2', data: [20, 30, 40] } ] } }),}</script>
Props
Props | Description | Type | Required |
---|---|---|---|
type | Chart.js type | String | true |
data | Chart.js datasets | Object | true |
options | Chart.js options | Object | false |
width | Chart width | Number | false |
height | Chart height | Number | false |
License
Vue-Chart-Js is open-sourced software licensed under the MIT license