riku
2024-07-17 264880703c677d63b7e35b5eb085e6bc3214e3ed
src/views/historymode/HistoryMode.vue
@@ -50,6 +50,7 @@
import Layer from '@/utils/map/3dLayer';
import marks from '@/utils/map/marks';
import sector from '@/utils/map/sector';
import mapUtil from '@/utils/map/util';
import { DialogUtil } from '@/utils/map/dialog';
import monitorDataApi from '@/api/monitorDataApi';
import { useFetchData } from '@/composables/fetchData';
@@ -58,6 +59,7 @@
import { FactorDatas } from '@/model/FactorDatas';
import TrendAnalysis from './component/TrendAnalysis.vue';
import DataSheet from './component/DataSheet.vue';
import { ElMessageBox, ElNotification, ElMessage } from 'element-plus';
export default {
  components: { TrendAnalysis, DataSheet },
@@ -94,14 +96,31 @@
    }
  },
  methods: {
    // 检查数据经纬度是否合法
    checkDataIsValid(index) {
      const lnglats_GD = this.factorDatas.lnglats_GD[index];
      const time = this.factorDatas.times[index];
      if (lnglats_GD[0] == 0 && lnglats_GD[1] == 0) {
        ElMessage({
          message: `${time}的数据经纬度无效`,
          type: 'warning'
        });
        return false;
      } else {
        this.locateIndex = index;
        return true;
      }
    },
    // 监听折线图和表格的点击事件
    handelIndexChange(index) {
      this.locateIndex = index;
      this.drawSector(index);
      if (this.checkDataIsValid(index)) {
        this.drawSector(index);
      }
    },
    draw() {
      // todo 刷新图例
      // 刷新图例
      const factor = this.factorDatas.factor[this.factorType];
      sector.clearSector();
      this.drawRoadMap(factor);
      this.drawMassMarks(factor);
    },
@@ -116,13 +135,18 @@
      marks.drawMassMarks(this.factorDatas, e, (index) => {
        // 查询范围内的监测站点
        // SceneUtil.searchByCoordinate(lnglat[0], lnglat[1], distance);
        this.drawSector(index);
        this.locateIndex = index;
        if (this.checkDataIsValid(index)) {
          this.drawSector(index);
        }
      });
      // 调整地图视角
      mapUtil.setBound(this.factorDatas.lnglats_GD);
    },
    drawSector(index) {
      // 1. 绘制新扇形区域
      sector.drawSector(this.factorDatas, index);
      const pr = sector.drawSector(this.factorDatas, index);
      // 调整视角居中显示
      mapUtil.setFitSector(pr);
      // 2. 绘制对话框
      DialogUtil.openNewWindow(this.factorDatas, index, () => {
        // 移除扇形区域
@@ -181,6 +205,9 @@
  },
  mounted() {
    this.fetchRealTimeData();
  },
  unmounted() {
    mapUtil.clearMap();
  }
};
</script>