前端vue中利用echarts实现折线图前半段数据实线后半段数据虚线

主要改两个点

一、

formatter: function(arg) {

            // 自定义提示

            if(arg[0].data[0]!=null){

              return (

              arg[0].name +

              "<br>" +

              '<span style="margin:0 5px 2px 0;display:inline-block;width:6px;height:6px;border-radius:5px;background-color:' +

              arg[0].color +

              ';"></span>' +

              arg[0].seriesName +

              '<span style="margin-left:10px;">' +

              arg[0].data +

              "</span>" +

              "<br>" +

              '<span style="margin:0 5px 2px 0;display:inline-block;width:6px;height:6px;border-radius:5px;background-color:' +

             

            }else{

              return (

              arg[1].name +

              "<br>" +

              '<span style="margin:0 5px 2px 0;display:inline-block;width:6px;height:6px;border-radius:5px;background-color:' +

              arg[1].color +

              ';"></span>' +

              arg[1].seriesName +

              '<span style="margin-left:10px;">' +

              arg[1].data +

              "</span>" +

              "<br>" +

              '<span style="margin:0 5px 2px 0;display:inline-block;width:6px;height:6px;border-radius:5px;background-color:' +

             

            );

            }     

        },

二、

 series: [

          {

            name: "库水位/m",

            type: "line", //bar:柱状 line:折线图

            data: [this.a[0],this.a[1],this.a[2],this.a[3],this.a[4],this.a[5],this.a[6],this.a[7],this.a[8],this.a[9],this.a[10],this.a[11],'','','','','','','','','','','',''],

            color: "#00C5AB",

            // symbol: "circle", //折线点设置为实心点

            symbolSize: 8, //折线点的大小

              smooth:false,   //关键点，为true是不支持虚线的，实线就用true

              

            itemStyle:{

                normal:{

                    lineStyle:{

                        width:2,

                        type:'solid'  //'dotted'虚线 'solid'实线

                    }

                }}

          },

                {

            name:  "库水位/m",

            type: "line", //bar:柱状 line:折线图

            data: ['','','','','','','','','','','',this.a[11],this.a[12],this.a[13],this.a[14],this.a[15],this.a[16],this.a[17],this.a[18],this.a[19],this.a[20],this.a[21],this.a[22],this.a[23]],

            color: "#00C5AB",

            // symbol: "circle", //折线点设置为实心点

            symbolSize: 8, //折线点的大小

              smooth:false,   //关键点，为true是不支持虚线的，实线就用true

              

            itemStyle:{

                normal:{

                    lineStyle:{

                        width:2,

                        type:'dotted'  //'dotted'虚线 'solid'实线

                    }

                }}

          },