echarts 实现类似心电图效果，随时间后移

// -----温湿度
    initCharts_wenshidu (echartsId) {
      let that = this
      // this.clearTiming_huozai_err() // 将定时器清除掉！！
      var i = 0
      var j = 0
      function randomData1 () { // 温度
        now = new Date(+now + 1000) // 间隔时间要和下面的定时间隔对应
        i++
        if (i >= constants.temperatureData.length) {
          i = 0
        }
        /* // 调用检查报警接口--火灾温度报警数据
        Api.CALL.checkAllErrCall()
          .then(res => {
            // 火灾温度报警接口
            let huozaiWendu = res.data.err_call_huozai_wendu
            if (huozaiWendu) {
              value1 = huozaiWendu // 将接口请求的报警数据合并到本地的正常数据
              // that.errCallShow_huozai_wendu(huozaiWendu) // todo 报警
            } else {
              value1 = constants.temperatureData[i]
            }
          }) */
        value1 = constants.temperatureData[i]
        return {
          name: now.toString(),
          value: [
            now,
            value1
          ]
        }
      }
      function randomData2 () { // 湿度
        j++
        if (j >= constants.electricityData.length) {
          j = 0
        }
        /*   // 调用检查报警接口
        Api.CALL.checkAllErrCall()
          .then(res => {
            // 光纤测温报警数据
            let huozaiDianliu = res.data.err_call_huozai_dianliu
            if (huozaiDianliu) {
              value2 = huozaiDianliu // 将接口请求的报警数据合并到本地的正常数据
              // that.errCallShow_huozai_dianliu(huozaiDianliu) // todo 报警
            } else {
              value2 = constants.electricityData[j]
            }
          }) */
        return {
          name: now.toString(),
          value: [
            now,
            value2
          ]
        }
      }
      let data1 = []
      let data2 = []
      var now = new Date()
      var value1 = 20// 实时显示值
      var value2 = 150// 实时显示值
      data1.push(randomData1())
      data2.push(randomData2())
      that.realTimeShow_call_line_wenshidu(echartsId, data1, data2)
      that.timer_today_call_2 = setTimeout(function () { // 刷新页面后立即加载，不要等待周期后加载
        data1.push(randomData1())
        data2.push(randomData2())
        that.realTimeShow_call_line_wenshidu(echartsId, data1, data2)
      }, 10)
      that.timer_today_call_1 = setInterval(function () {
        if (data1.length > 120) { // 当数组长度超过设定长度时；改变数组
          data1.shift()
        }
        if (data2.length > 120) { // 当数组长度超过设定长度时；改变数组
          data2.shift()
        }
        data1.push(randomData1())
        data2.push(randomData2())
        that.realTimeShow_call_line_wenshidu(echartsId, data1, data2)
      }, 1000)
    },

echarts

    realTimeShow_call_line_wenshidu (echartsId, data1, data2) {
      this.chart = Echarts.init(document.getElementById(echartsId))// 初始化echarts实例
      this.chart.setOption({
        tooltip: {
          trigger: 'axis',
          axisPointer: {
            animation: false
          }
        },
        legend: {
          data: ['温度(℃)', '湿度(%RH)'],
          right: '10%',
          top: '0'
        },
        grid: {
          top: 8,
          left: '1%',
          width: '392px',
          right: '0%',
          bottom: '1%',
          containLabel: true
        },
        xAxis: {
          type: 'time',
          splitLine: {
            show: false
          },
          axisLine: {
            lineStyle: {
              color: 'darkgray',
              width: 1
            }
          }
        },
        yAxis: {
          type: 'value',
          boundaryGap: [0, '100%'],
          splitLine: {
            show: false
          },
          axisLine: {
            lineStyle: {
              color: 'darkgray',
              width: 1
            }
          }
          // axisLabel: {
          //   formatter1: '{value}'
          // }
        },
        series: [
          {
            name: '温度(℃)',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            itemStyle: {
              normal: {
                lineStyle: { // 线的颜色
                  color: '#9000FF',
                  width: 1
                }
              }
            },
            data: data1
          },
          {
            name: '湿度(%RH)',
            type: 'line',
            showSymbol: false,
            hoverAnimation: false,
            itemStyle: {
              normal: {
                lineStyle: { // 线的颜色
                  color: '#0077FF',
                  width: 1
                }
              }
            },
            data: data2
          }
        ]
      })
    },