When using Echarts to generate charts, it is often necessary to do tedious data type conversion and modify complex configuration items. V-charts is designed to solve this pain point. The v-charts component based on Vue2.0 and echarts package can easily generate common charts by providing a unified data format friendly configuration item for both front and back ends.

The installation

npm i v-charts echarts -S
Copy the code

The document

v-charts.js.org

Quick learning

<template> <div> <ve-line :data="chartData"></ve-line> </div> </template> <script> import VeLine from 'v-charts/lib/line' export default {created () {this.chartData = {columns: [' date ', 'volume '], rows: [{' date ': On January 1, 'a' and 'sales' : 123}, {' date' : 'January 2', 'sales' : 1223}, {' date' : 'on January 3,' sales' : 2123}, {' date ':' on January 4, 'sales' : 4123}, {' date ':' January 5 ', 'sales' : 3123}, {' date' : 'January 6', 'sales' : 7123}}}, components: {VeLine}} < / script >Copy the code

LICENSE

MIT