vue-echarts
npm install echarts vue-echarts
特点:
- 比较简单
- 基于echarts的简单封装。
- 一直在迭代更新。
使用
// 引入 import VueEcharts from 'vue-echarts' // 注册组件 Vue.component('vue-echarts', VueEcharts) //使用 <vue-echarts :options="data"></vue-echarts>
v-charts
由于不在维护,vue3不能使用。在vue2中使用还是挺方便的。
npm i v-charts echarts -S
注意:安装的时候,由于没有在维护,可能会出现版本不兼容问题。建议安装一下版本的v-charts和echart
"echarts": "^4.9.0", "v-charts": "^1.19.0", "vue": "^2.6.11", "vue-echarts": "^5.0.0-beta.0",
特点:
- 可以快速生成图表,不需要修改。
- 需要学习大量api。
- 如果需要实现一些特殊图表(水球,词云图等)他是非常方便的。直接提供数据,就能快速渲染。
使用
// 引入 import VCharts from 'v-charts' import 'v-charts/lib/style.css' // 注册插件 Vue.use(VCharts) // 使用 根据他的内置组件,并绑定data数据