1、需要场景: 实现折线统计图,如果蕴含明天,明天用虚线示意,其余用实线
2、实现思路: 将一条线进行切割,如明天是20210909,从20210901到20210909的区间将其宰割为两段为20210901-20210908,20210908-20210909
3、具体代码实现:

//明天设为虚线的办法//data须要解决的y轴显示数据,dateData为x轴数据-日期setDottedLine(data,dateData){  //明天  let nowTime = new Date()  let chooseYear = nowTime.getFullYear()  let chooseMonth = nowTime.getMonth() + 1  let chooseDate = nowTime.getDate()  if (chooseMonth < 10) chooseMonth = '0' + chooseMonth  if (chooseDate < 10) chooseDate = '0' + chooseDate  let today = `${chooseYear}-${chooseMonth}-${chooseDate}`;  //昨天  let oneday = new Date(nowTime - 1 * 24 * 3600 * 1000);  let chooseYearonedayago = oneday.getFullYear()  let chooseMonthonedayago = oneday.getMonth() + 1  let chooseDateonedayago = oneday.getDate()  if (chooseMonthonedayago < 10) chooseMonthonedayago = '0' + chooseMonthonedayago  if (chooseDateonedayago < 10) chooseDateonedayago = '0' + chooseDateonedayago  let yesterday = `${chooseYearonedayago}-${chooseMonthonedayago}-${chooseDateonedayago}`;  if(dateData.includes(today)){    let newObj = {}    let arraySolid = [];    let arrayDotted = [];    for(let i=0; i<dateData.length; i++){      if(dateData[i]==yesterday){        arraySolid.push(data[i])        arrayDotted.push(data[i])      }else if(dateData[i]==today){        arraySolid.push(null)        arrayDotted.push(data[i])      }else{        arraySolid.push(data[i])        arrayDotted.push(null)      }    }    this.$set(newObj,'arraySolid',arraySolid) //实线    this.$set(newObj,'arrayDotted',arrayDotted) //虚线    return newObj  }else{    return data  }}

//调用

    let ljyhDataResult = this.setDottedLine(ljyhData,xAxisData);    this.option.series = [        {          name: '累计用户',          data: ljyhDataResult.arraySolid?ljyhDataResult.arraySolid:ljyhDataResult,          type: 'line',          symbolSize: 2,          smooth: 0.5,          yAxisIndex: 0        },        {          name: '累计用户',          data: ljyhDataResult.arrayDotted?ljyhDataResult.arrayDotted:ljyhDataResult,          type: 'line',          symbolSize: 2,          smooth: 0.5,          yAxisIndex: 0,          lineStyle:{            normal:{              type:'dotted'            }          }        }      ],

须要解决提示框显示的问题,采纳以上代码会呈现两次累计用户的tooltip,须要去重

// 提示框    tooltip: {      trigger: 'axis',      formatter:function(params){        let str = '';        let newarray = [];        let contentarray = [];        for(let i=0;i<params.length;i++){          newarray.push(params[i].axisValue+'<br>')          if(params[i].data==undefined){          }else{            if(['激活率a','激活率b'].includes(params[i].seriesName)){              newarray.push(params[i].marker+params[i].seriesName+":"+params[i].data+"%<br>");            }else{              newarray.push(params[i].marker+params[i].seriesName+":"+params[i].data+"<br>");            }          }        }        for(let i=0; i<newarray.length; i++){          if(contentarray.indexOf(newarray[i])==-1){            contentarray.push(newarray[i])          }        }        for(let i=0; i<contentarray.length;i++){          str+=contentarray[i];        }        return str;      }    },