v-charts tooltip All In One
<template>
<ve-pie
:data="chartData"
:extend="chartExtend"
:settings="chartSettings"
:colors="chartColors"
/>
</template>
<script>
export default {
data () {
return {
chartExtend: {
tooltip: {
formatter: (params) => {
console.log('params', params);
return '✅ 自定义 <mark>tooltip</mark>';
},
},
},
chartData: {
columns: ['日期', '访问用户'],
rows: [
{ '日期': '1/1', '访问用户': 1393 },
{ '日期': '1/2', '访问用户': 3530 },
{ '日期': '1/3', '访问用户': 2923 },
{ '日期': '1/4', '访问用户': 1723 },
{ '日期': '1/5', '访问用户': 3792 },
{ '日期': '1/6', '访问用户': 4593 }
]
},
chartColors: [
'#3CADFF',
'#67C23A',
'#FFDB43',
'#FF9356',
],
chartSettings: {
//
},
}
}
}
</script>
demo
API
https://v-charts.xgqfrms.xyz/#/props-demo2
https://v-charts.xgqfrms.xyz/#/pie
refs
https://www.cnblogs.com/xgqfrms/p/15701229.html
https://www.cnblogs.com/xgqfrms/p/15799334.html
©xgqfrms 2012-2020
www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！
原创文章，版权所有©️xgqfrms, 禁止转载 ️，侵权必究⚠️！