添加动态污染溯源相关逻辑（待完成）

riku

2025-05-08 6f7bbdd390abdcdb2cdaef980bc69816a3ff2202

添加动态污染溯源相关逻辑（待完成）

 src/api/dataAnalysisApi.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,14 @@
import { $http } from './index';

export default {
  /**
   * æ±¡æŸ“溯源分析
   * @param {String} missionCode
   * @returns
   */
  pollutionTrace(missionCode) {
    return $http
      .get(`air/analysis/pollution/trace`, { params: { missionCode } })
      .then((res) => res.data);
  }
};

 src/api/index.js

@@ -1,7 +1,7 @@
import axios from 'axios';
import { ElMessage } from 'element-plus';

const debug = false;
const debug = true;

let ip1 = 'http://47.100.191.150:9029/';
// console.log(import.meta.env);

 src/utils/map/3dLayer.js

@@ -166,6 +166,78 @@
  _cylinder = cylinder;
}

/**
 * ç»˜åˆ¶é«˜äº®çš„污染区域3D立面
 */
var _polCylinder = undefined;
var _polFactorDatas = {
    lnglats: [],
    heights: [],
    type: ''
  },
  //当前选中的监测因子数据
  _polFactor = {};
function drawHighLight3DLayer(fDatas, factor) {
  const offsetH = 40;

  const lnglats_GD = fDatas.lnglats_GD;
  const coors = fDatas.coors_GD;
  const heights = factor.heights;
  const colors = factor.colors;
  const bColors = factor.bottomColors;

  // eslint-disable-next-line no-undef
  var cylinder = new AMap.Object3D.Mesh();
  cylinder.backOrFront = 'both';
  cylinder.transparent = true;

  var geometry = cylinder.geometry;

  const scale = _getScale(_minH, _maxH);
  for (let i = 0; i < coors.length; i++) {
    var r = lnglats_GD[i];
    var lastP = lnglats_GD[i - 1];
    var p = coors[i];
    var h = (heights[i] - _minH) * scale + _minHeight;
    if (heights[i] == -1) {
      h = -1;
    }

    geometry.vertices.push(p.x, p.y, 0 - h); //底部顶点
    geometry.vertices.push(p.x, p.y, 0 - h - offsetH); //顶部顶点

    if (i > 0) {
      // eslint-disable-next-line no-undef
      var distance = AMap.GeometryUtil.distance(r, lastP);
      //两个数据点最小间隔时间为4s，假设车速按照120km/h计算，4s行驶最大距离作为132米，
      //设定超过1分钟的数据绘制特殊的连线
      if (distance <= 500 && h != -1) {
        var bottomIndex = i * 2;
        var topIndex = bottomIndex + 1;
        var lastBottomIndex = bottomIndex - 2;
        var lastTopIndex = bottomIndex - 1;
        geometry.faces.push(bottomIndex, topIndex, lastTopIndex);
        geometry.faces.push(bottomIndex, lastBottomIndex, lastTopIndex);
      }
    }

    // const color = [1, 1, 1, 0.75]
    const color = [1, 0, 0, 0.75];
    geometry.vertexColors.push.apply(geometry.vertexColors, color); //底部顶点颜色
    geometry.vertexColors.push.apply(geometry.vertexColors, color); //顶部顶点颜色
  }

  // 7.根据合并选项重置或新增当前缓存数据
  _polFactorDatas = fDatas;
  _polFactor = factor;
  if (_polCylinder != undefined) {
    object3Dlayer.remove(_polCylinder);
  }
  object3Dlayer.add(cylinder);

  _polCylinder = cylinder;
}

export default {
  clear() {
    map.off('zoomend', onMapZoom);
@@ -211,5 +283,7 @@
    if (lnglats_GD.length > 0) {
      map.on('zoomend', onMapZoom);
    }
  }
  },

  drawHighLight3DLayer
};

 src/utils/map/pollution_trace.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,24 @@
/**
 * æ±¡æŸ“溯源
 */

/**
 * ç»˜åˆ¶é«˜äº®çš„污染区域3D立面
 */
function drawHighLight3DLayer() {}

/**
 * ç»˜åˆ¶æ¶‰åŠçš„污染场景
 */
function drawPollutionScene() {}

/**
 * ç»˜åˆ¶åå‘溯源扇形
 */
function drawSectors() {}

export default {
  drawHighLight3DLayer,
  drawPollutionScene,
  drawSectors
};

 src/views/historymode/HistoryMode.vue

@@ -8,6 +8,13 @@
        @search="onSearch"
      ></SearchBar>
      <TrajectoryState v-show="status != 0" :status="status"></TrajectoryState>
      <el-button
        type="primary"
        class="p-events-auto el-button-custom"
        @click="handleClick"
      >
        åˆ†æž
      </el-button>
    </el-row>
    <el-row class="m-t-2">
      <FactorRadio
@@ -64,6 +71,7 @@
import DataSheet from './component/DataSheet.vue';
import { ElMessage } from 'element-plus';
import { fetchHistoryData } from '@/utils/factor/data';
import dataAnalysisApi from '@/api/dataAnalysisApi';
import { mapStores } from 'pinia';
import { useSceneStore } from '@/stores/scene';

@@ -196,9 +204,10 @@
      });
    },
    onSearch(option) {
      const { deviceType, deviceCode, timeArray } = option;
      const { deviceType, deviceCode, timeArray, mission } = option;
      this.deviceType = deviceType;
      this.deviceCode = deviceCode;
      this.mission = mission;
      let startTime, endTime;
      if (timeArray && timeArray.length == 2) {
        startTime = moment(timeArray[0]).format('YYYY-MM-DD HH:mm:ss');
@@ -214,6 +223,19 @@
          perPage: pageSize
        }).then((res) => this.onFetchData(deviceType, res.data));
      });
    },
    handleClick() {
      const { missionCode } = this.mission;
      dataAnalysisApi.pollutionTrace(missionCode).then((res) => {
        res.data.forEach((e) => {
          const fDatas = new FactorDatas();
          fDatas.setData(e.dataVoList, this.drawMode, () => {
            fDatas.refreshHeight(this.factorType);
            Layer.drawHighLight3DLayer(fDatas, fDatas.factor[this.factorType]);
            console.log(e.dataVoList);
          });
        });
      });
    }
  },
  mounted() {