Vue-schart是一个基于Vue的图表库，它通过封装SChart.js，并扩展支持Vue状态组件的方式，提供了一个易于使用和强大的图表库。

简单来说，Vue-schart可以帮助我们快速方便的在Vue项目中使用图表，并且可以定制化图表样式和交互行为，非常适合在数据可视化方面的开销项目中使用。

下面是一个简单的Vue-schart实例：

<template><div><schart :canvasId="canvasId" :canvasWidth="canvasWidth" :canvasHeight="canvasHeight" :opts="opts"></schart></div></template><script>import Schart from 'vue-schart'
export default {
components: { Schart },
data () {
return {
canvasId: 'myCanvas',
canvasWidth: 360,
canvasHeight: 320,
opts: {
type: 'line',
data: {
labels: ["Mon", "Tue", "Wed", "Thu", "Fri", "Sat", "Sun"],
datasets: [{
label: 'Number of Customers',
data: [50, 100, 70, 80, 60, 110, 120],
backgroundColor: '#448AFF',
borderColor:'#448AFF',
borderWidth: 1,
fill: false,
}]
},
options: {
responsive: true,
maintainAspectRatio: true,
}
}
}
}
}
</script>

首先，需要在Vue中注册Schart组件。接着在组件中定义三个数据变量，canvasId、canvasWidth和canvasHeight，作为图表的容器元素的ID、宽和高。注意，ID不能与页面上其他元素重复。

opts是图表的配置选项，由type、data和options三部分组成。type指定图表类型，data指定图表的数据，options指定图表的其他配置项。在上面的实例中，opts配置了一个线性图，展示了七天内每天顾客的数量。

需要注意的是，Vue-schart支持在data中定义多组数据，同时也支持在options中设置动画效果类型、缩放和拖拽等交互行为。

接下来，将Schart组件加入到模板中，使用canvasId、canvasWidth和canvasHeight作为属性传递给组件，opts中定义的选项也通过属性opts传递给组件。

Vue-schart还提供了许多其他的API和配置选项，包括通过ref调用图表实例、在图表标尺上显示标签、定义响应式图表、自定义图表颜色样式和图标样式等，这些都是使用Vue-schart进行数据可视化时非常有用的功能。

总之，Vue-schart是一个功能强大且易于使用的图表库，可以帮助我们轻松创建自定义的数据可视化应用程序。如果你还没有使用Vue-schart，那么现在就是一个好的时间来开始学习它！