修改历史数据获取逻辑

riku

2024-08-29 6b6eff08baa3d052b66fd2e68f1ac0d8495f6f8a

 src/components/chart/ProgressLineChart.vue

@@ -40,7 +40,9 @@
      allSeries: [],
      option: null,
      pageSize: 200,
      progress: 0
      progress: 0,
      // 对应progress进度下，所展示数据的起始索引
      sIndex: 0
    };
  },
  emits: ['chartClick'],
@@ -65,13 +67,6 @@
    },
    locateIndex(nV, oV) {
      if (nV == oV) return;
      // 1. 定位点应该展示在趋势图中间，因此定位百分比往前偏移当前_size的一半
      let i = nV - parseInt(this.pageSize / 2);
      // 2. 确保索引不会超出范围
      i = i < 0 ? 0 : i;
      // 3. 获取索引对应的进度百分比
      this.progress = (i / (this.allXAxis.length - this.pageSize)) * 100;

      for (const iterator of this.allSeries) {
        // if (iterator.name == factorName || (iterator.name == 'TVOC' || factorName == 'VOC')) {
        iterator.markLine = {
@@ -90,7 +85,21 @@
          ]
        };
      }
      this.changeChartRange();
      // 计算超出单页数据量的长度
      let len = this.allXAxis.length - this.pageSize;
      len = len < 0 ? 0 : len;
      // 定位点应该展示在趋势图中间，因此定位百分比往前偏移当前_size的一半
      let i = nV - parseInt(this.pageSize / 2);
      // 确保索引不会超出范围
      i = i < 0 ? 0 : i;
      i = i > len ? len : i;
      // 获取索引对应的进度百分比
      const _progress = len == 0 ? 0 : (i / len) * 100;
      if (this.progress != _progress) {
        this.progress = _progress;
      } else {
        this.changeChartRange();
      }
    }
  },
  methods: {
@@ -141,9 +150,7 @@
    },
    getShowSeries(sIndex, eIndex) {
      this.allSeries.forEach((s) => {
        if (sIndex && eIndex) {
          s.data = s.allData.slice(sIndex, eIndex);
        }
        s.data = s.allData.slice(sIndex, eIndex);
      });
      const res = this.allSeries.filter((s) => {
        return this.selectFactorType.includes(s.key);
@@ -155,8 +162,9 @@
      len = len < 0 ? 0 : len;
      const sIndex = Math.round((len * this.progress) / 100);
      const eIndex = sIndex + this.pageSize;
      const startPer = (sIndex / this.allXAxis.length) * 100;
      const startPer = (this.sIndex / this.allXAxis.length) * 100;
      const endPer = (eIndex / this.allXAxis.length) * 100;
      this.sIndex = sIndex;
      return { sIndex, eIndex, startPer, endPer };
    }
  },
@@ -166,7 +174,7 @@
  mounted() {
    this.lineChart = echarts.init(this.$refs.lineChart);
    this.lineChart.on('click', (e) => {
      this.$emit('chartClick', e.dataIndex);
      this.$emit('chartClick', this.sIndex + e.dataIndex);
    });
  }
};