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

riku

2025-05-08 6f7bbdd390abdcdb2cdaef980bc69816a3ff2202

 src/utils/map/3dLayer.js

@@ -30,6 +30,7 @@
  const fDatas = _factorDatas;
  const factor = _factor;
  drawMesh(fDatas, factor);
  // console.log(map.getZoom());
}

var _maxHeight = 1000,
@@ -90,15 +91,13 @@
/**
 * 绘图
 */
function drawMesh(fDatas, factor, center, merge) {
function drawMesh(fDatas, factor, merge) {
  const lnglats_GD = fDatas.lnglats_GD;
  const coors = fDatas.coors_GD;
  const heights = factor.heights;
  const colors = factor.colors;
  const bColor = factor.bottomColor;
  if (center) {
    map.setZoomAndCenter(16, center);
  }
  // const bColor = factor.bottomColor;
  const bColors = factor.bottomColors;

  // eslint-disable-next-line no-undef
  var cylinder = new AMap.Object3D.Mesh();
@@ -135,10 +134,8 @@
      }
    }

    // var bColor = bColor
    var tColor = colors[i];
    geometry.vertexColors.push.apply(geometry.vertexColors, bColor); //底部顶点颜色
    geometry.vertexColors.push.apply(geometry.vertexColors, tColor); //顶部顶点颜色
    geometry.vertexColors.push.apply(geometry.vertexColors, bColors[i]); //底部顶点颜色
    geometry.vertexColors.push.apply(geometry.vertexColors, colors[i]); //顶部顶点颜色
  }

  // 7.根据合并选项重置或新增当前缓存数据
@@ -169,15 +166,94 @@
  _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);
    if (_cylinder != undefined) {
      object3Dlayer.remove(_cylinder);
    }
  },

  drawMesh: drawMesh,
  /**
   * 绘制3D走行路线图
   * @param fDatas 完整监测数据
   * @param factor 当前展示的监测因子对象
   * @param merge 是否和之前绘制的图形合并
   * @param setCenter 镜头是否自动移动至图形中心
   */
  drawRoadMap(fDatas, factor, merge, setCenter) {
  drawRoadMap(fDatas, factor, merge) {
    const lnglats_GD = fDatas.lnglats_GD;
    const heights = factor.heights;

@@ -197,23 +273,8 @@
      _maxH = maxH;
    }

    // 3.确定定位坐标点
    var center;
    if (setCenter && lnglats_GD.length > 0) {
      var p = lnglats_GD[0];
      for (let i = 0; i < lnglats_GD.length; i++) {
        const e = lnglats_GD[i];
        if (e[0] != 0) {
          p = e;
          break;
        }
      }
      // eslint-disable-next-line no-undef
      center = new AMap.LngLat(...p);
    }

    // 5.绘制3D图形
    drawMesh(fDatas, factor, center, merge);
    this.drawMesh(fDatas, factor, merge);

    // 缩放地图到合适的视野级别
    // map.setFitView()
@@ -222,5 +283,7 @@
    if (lnglats_GD.length > 0) {
      map.on('zoomend', onMapZoom);
    }
  }
  },

  drawHighLight3DLayer
};