当前位置: 首页 > Web前端 > vue.js

Echarts折线图实现虚实结合

时间:2023-03-31 16:56:47 vue.js

1、需求场景:实现折线统计图表。如果包括今天,今天用虚线表示,其余用实线表示。分部为20210901-20210908、20210908-202109093。具体代码实现://今天设置虚线的方法//data需要处理y轴显示数据,dateData为x轴数据-datesetDottedLine(data,dateData){//今天让nowTime=newDate()letchooseYear=nowTime.getFullYear()letchooseMonth=nowTime.getMonth()+1letchooseDate=nowTime.getDate()if(chooseMonth<10)chooseMonth='0'+chooseMonthif(chooseDate<10)chooseDate='0'+chooseDate让今天=`${chooseYear}-${chooseMonth}-${chooseDate}`;//昨天letoneday=newDate(nowTime-1*24*3600*1000);让chooseYearonedayago=oneday.getFullYear()让chooseMonthonedayago=oneday.getMonth()+1让chooseDateonedayago=oneday.getDate()if(chooseMonthonedayago<10)chooseMonthonedayago='0'+chooseMonthonedayagoif(chooseDateonedayagocho<10')0'+chooseDateonedayago让昨天=`${chooseYearonedayago}-${chooseMonthonedayago}-${chooseDateonedayago}`;if(dateData.includes(today)){letnewObj={}letarraySolid=[];让arrayDotted=[];for(leti=0;i')if(params[i].data==undefined){}else{if(['激活率a','激活率b'].includes(params[i].seriesName)){newarray.push(params[i].marker+params[i].seriesName+":"+params[i].data+"%
");}else{newarray.push(params[i].marker+params[i].seriesName+":"+params[i].data+"
");}}}为(让我=0;我<新数组长度;i++){如果(contentarray.indexOf(newarray[i])==-1){contentarray.push(newarray[i])}}for(leti=0;i