湖州项目前端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

65 lines
1.1 KiB

<template>
<v-chart :option="option" theme="auto" :autoresize="true" style="width: 100%; height: 400px" />
</template>
<script lang="ts" name="PieChart" setup>
import { ref, reactive } from 'vue'
let receivingParameter = defineProps(["title", "data"])
let option = reactive({})
option = {
title: {
text: receivingParameter.title
},
// tooltip: {
// trigger: 'axis',
// axisPointer: {
// type: 'shadow'
// }
// },
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true
},
yAxis: {
type: 'category',
data:receivingParameter.data.names,
},
xAxis: {
type: 'value',
min: 0,
max: 1,
axisLabel: {
formatter: function (value, index) {
return (value*100) + "%";
}
}
},
series: [
{
data: receivingParameter.data.values,
type: 'bar',
showBackground: true,
backgroundStyle: {
color: 'rgba(180, 180, 180, 0.2)'
},
label: {
show: true,
position: 'right',
formatter: function (params) {
return (params.value*100) + "%";
}
}
}
]
};
</script>
<style></style>