水球图效果如下:
水球图,搭配版本如下:
》执行命令:
npm install echarts@4.9.0
npm install echarts-gl@1.1.2
npm install echarts-liquidfill@2.0.6
》main.js里面引用
import * as echarts from "echarts";
import "echarts-liquidfill";
》组件编写
》组件引入到页面中,然后设置data属性
<liquidFill :data="ChartData"></liquidFill>
data() {
return {
ChartData: {
id: "chart1",
value: 0.54,
text: "处理率",
radius:"70%"
}
},