welfare-admin/src/components/echart/bottom/bottomLeftChart/index.vue

67 lines
1.2 KiB
Vue

<template>
<div>
<Chart :cdata="cdata" />
</div>
</template>
<script>
import Chart from './chart.vue'
export default {
data () {
return {
cdata: {
category: [
{value:'下堡坪村', id:1},
{value:'蛟龙寺村', id:2},
{value:'九山村', id:3},
{value:'马宗岭村', id:4},
{value:'赵勉河村', id:5},
{value:'秀水村', id:6},
{value:'磨坪村', id:7},
{value:'十八湾村', id:8}
],
lineData: [
15,
8,
5,
9,
7,
10,
9,
4
],
barData: [
13,
6,
4,
7,
6,
3,
7,
3
],
rateData: []
}
}
},
components: {
Chart
},
mounted () {
this.setData()
},
methods: {
// 根据自己的业务情况修改
setData () {
for (let i = 0; i < this.cdata.barData.length - 1; i++) {
const rate = this.cdata.barData[i] / this.cdata.lineData[i]
this.cdata.rateData.push(rate.toFixed(2))
}
}
}
}
</script>
<style lang="scss" scoped>
</style>