A Powerful and Highspeed Chart Parser for Vue.
- version 1.X.X for vue1.X.X
- version 2.X.X for vue2.X.X
The dist folder contains
vue-chart.jsandvue-chart.min.jswith the component exported in thewindow.VueChartobject.
<body>
<vue-chart type="line" :data="myData" :options="myOptions"></vue-chart>
</body>
<script src="path/to/vue.js"></script>
<script src="path/to/vue-chart.js"></script>
<script>
var vm = new Vue({
el: "body",
components: {
VueChart
}
});
</script>var VueChart = require('vue-chart');
new Vue({
components: {
'vue-chart': VueChart
}
})// <script src="dist/vue-chart.js"></script>
new Vue({
components: {
VueChart
}
})import VueChart from 'vue-chart'
new Vue({
components: {
VueChart
}
})| Prop | Type | Default |
|---|---|---|
| type | String | type="line" |
| data | Object | DOCS |
| options | Object | DOCS |
| Done | Prop | Type | Required | Description |
|---|---|---|---|---|
| No | type | String | no | default is line |
| No | datasets | Array[object] | yes | Chart.data.datasets |
| No | labels | Array[String] | yes | Chart.data.labels |
| No | xLabels | Array[String] | no | Chart.data.xLabels |
| No | yLabels | Array[String] | no | Chart.data.yLabels |
| No | common | Object | no | Common Chart Configuration |
| No | title | Object | no | Title Configuration |
| No | legend | Object | no | Legend Configuration |
| No | tooltip | Object | no | Tooltip Configuration |
| No | hover | Object | no | Hover Configuration |
| No | animation | Object | no | Animation Configuration |
| No | element | Object | no | Element Configuration |