v-charts pie All In One
label
tooltips
<template>
<ve-pie :data="chartData" :settings="chartSettings"></ve-pie>
</template>
<script>
export default {
data () {
// 其他
this.chartSettings = {
// limitShowNum: 7,
};
return {
chartData: {
columns: ['media_src_name', 'cost_amount'],
rows:[
{
"media_src_name": "Google",
"cost_amount": "1842922494.10"
},
{
"media_src_name": "Facebook",
"cost_amount": "1051778548.30"
},
{
"media_src_name": "巨量引擎",
"cost_amount": "1025449104.99"
},
{
"media_src_name": "广点通",
"cost_amount": "197694632.36"
},
{
"media_src_name": "Apple",
"cost_amount": "118538306.15"
},
{
"media_src_name": "Unityads",
"cost_amount": "79004376.33"
},
{
"media_src_name": "快手广告",
"cost_amount": "75649605.63"
},
{
"media_src_name": "其他",
"cost_amount": "431224102.38"
}
]
}
}
}
}
</script>
demo
https://codepen.io/xgqfrms/pen/LYzMpGm
refs
饼图
https://v-charts.xgqfrms.xyz/#/pie
©xgqfrms 2012-2020
www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！
原创文章，版权所有©️xgqfrms, 禁止转载 ️，侵权必究⚠️！