vue项目用echarts画折线区域图，并进行相关参数配置。

要求

显示一条折线图表示河堤数据，两条区域图分别显示水流和河底数据。

效果

实现

 <div id="charts1"  class="ct1"></div>

//获取数据
getData() {
   
      getDataApi().then((res) => {
   
        if (res.status == 200) {
   
          let data = res.data.data;
          let arr = {
   
            x: [],
            y1: [],
            y2: [],
            y3: [],
          };
          data.forEach((item) => {
   
            arr.x.push(item.distance + "公里");
            arr.y1.push(item.leveeElevation);
            arr.y2.push(item.v0)