【v-charts】多条折线图只一条显示线上文字(formatter设置线上文字样式)

<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 可以设置单条线,就比较简单了。

series: [
       {
           name: '下单用户',//线的名称
           type: 'line',
           data: [11, 11, 15, 13, 12, 13, 10],
           label:{ 
               show:true //显示线的文字
           }
           
       },
]

推荐阅读更多精彩内容