41 lines
699 B
Vue
41 lines
699 B
Vue
|
<template>
|
||
|
|
<VChart :option="option" />
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script lang="ts" setup>
|
||
|
|
import { reactive } from "vue";
|
||
|
|
import { use } from "echarts/core";
|
||
|
|
import { CanvasRenderer } from "echarts/renderers";
|
||
|
|
import { TitleComponent } from "echarts/components";
|
||
|
|
import 'echarts-liquidfill'
|
||
|
|
import VChart from "vue-echarts";
|
||
|
|
|
||
|
|
|
||
|
|
use([
|
||
|
|
CanvasRenderer,
|
||
|
|
TitleComponent
|
||
|
|
]);
|
||
|
|
|
||
|
|
|
||
|
|
const option = reactive({
|
||
|
|
title: {
|
||
|
|
text: '海拔',
|
||
|
|
left: 'center'
|
||
|
|
},
|
||
|
|
series: [{
|
||
|
|
type: 'liquidFill',
|
||
|
|
backgroundStyle: {
|
||
|
|
color: 'transparency'
|
||
|
|
},
|
||
|
|
label: {
|
||
|
|
formatter: function({ value }) {
|
||
|
|
return value
|
||
|
|
}
|
||
|
|
},
|
||
|
|
data: [60, 0.5, 0.4, 0.3]
|
||
|
|
}]
|
||
|
|
})
|
||
|
|
|
||
|
|
const update = console.log
|
||
|
|
defineExpose({ update })
|
||
|
|
</script>
|