1. 플러그인 버전
"echarts": "^5.3.3",
"echarts-liquidfill": "^3.1.0",
2. 간단한 물결볼 그리기
<template>
<div ref="liquidfillChart" class="chart-content">暂无数据</div>
</template>
<script>
import * as echarts from 'echarts';
import 'echarts-liquidfill';
export default {
name: 'liquidfill',
data() {
return {};
},
mounted() {
this.draw();
},
methods: {
draw() {
this.chart = echarts.init(this.$refs.liquidfillChart);
var option = {
series: [{
type: 'liquidFill',
data: [0.6],
}]
};
this.chart.setOption(option);
},
},
};
</script>
<style scoped>
.chart-content {
width: 100%;
height: 600px;
box-sizing: border-box;
border: 1px solid #ccc;
}
</style>
렌더링: