<template>
<ve-line :data="chartData" :extend="extend" ></ve-line>
</template>
<script>
export default {
data () {
this.extend={
series: {
label: {
show: true,
formatter: function(params){
console.log(params)
if(params.seriesIndex == 2){
// 在這里面可以return特定樣式
}else{
return '' // 不需要的return空
}
}
}
},
}
return {
chartData: {
columns: ['日期', '訪問用戶', '下單用戶', '下單率'],
rows: [
{ '日期': '1/1', '訪問用戶': 1393, '下單用戶': 1093, '下單率': 0.32 },
{ '日期': '1/2', '訪問用戶': 3530, '下單用戶': 3230, '下單率': 0.26 },
{ '日期': '1/3', '訪問用戶': 2923, '下單用戶': 2623, '下單率': 0.76 },
{ '日期': '1/4', '訪問用戶': 1723, '下單用戶': 1423, '下單率': 0.49 },
{ '日期': '1/5', '訪問用戶': 3792, '下單用戶': 3492, '下單率': 0.323 },
{ '日期': '1/6', '訪問用戶': 4593, '下單用戶': 4293, '下單率': 0.78 }
]
}
}
}
}
</script>
echarts 可以設(shè)置單條線菊卷，就比較簡(jiǎn)單了终息。
series: [
{
name: '下單用戶',//線的名稱
type: 'line',
data: [11, 11, 15, 13, 12, 13, 10],
label:{
show:true //顯示線的文字
}
},
]
