vue 使用 v-charts 实现环形图

v-charts 文档直达

v-charts 有环形图的示例demo

但这不是我想要的效果，需要自己调整一下样式

下图是我调整之后的样子，我隐藏了自带的legend，环形图里面的颜色改成了渐变色

1、安装v-charts

npm i v-charts echarts -S

2、在main.js 引入环形图

因为我现在里面只用到了环形图，所以我只引入了这一个。

// main.js
import VeRing from 'v-charts/lib/ring.common'// 环形图

Vue.component(VeRing.name, VeRing)

3、页面使用环形图

HTML：

    <ve-ring
      height="250px"
      width="350px"
      :data="chartData"
      :extend="chartExtend"
      :settings="chartSettings"
    >
    </ve-ring>

JS：

chartData是后端返回的数据，根据 v-cha