From 977e332a5338942df338728dbfb77a359e35bd0b Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期五, 09 五月 2025 12:25:21 +0800 Subject: [PATCH] 添加动态溯源相关逻辑(待完成) --- src/utils/map/3dLayer.js | 268 ++++++++++++++++++++++++++++++++++++++++++++++++----- 1 files changed, 243 insertions(+), 25 deletions(-) diff --git a/src/utils/map/3dLayer.js b/src/utils/map/3dLayer.js index d0ad682..5222ed4 100644 --- a/src/utils/map/3dLayer.js +++ b/src/utils/map/3dLayer.js @@ -1,3 +1,7 @@ +/** + * 楂樺痉鍦板浘3D鍥惧舰缁樺埗鐩稿叧 + */ + import { map, object3Dlayer } from './index_old'; // 3d鍥惧舰 @@ -25,26 +29,252 @@ } const fDatas = _factorDatas; const factor = _factor; - // MapUtil._object3Dlayer.clear() - // MapUtil.drawMesh(f.lnglats, f.heights, f.type, false) - MapUtil.drawMesh2(fDatas, factor); - MapUtil.drawMarker(); + drawMesh(fDatas, factor); + + if (_polFactorDatasList.length > 0) { + _polCylinderList.forEach((p) => { + object3Dlayer.remove(p); + }); + _polCylinderList = []; + _polFactorDatasList.forEach((e, i) => { + drawHighLight3DLayer(e, _polFactorList[i]); + }); + } + // console.log(map.getZoom()); +} + +var _maxHeight = 1000, + _minHeight = 100, + _lastZoom = -1; +/** + * 鑾峰彇褰撳墠鍦板浘缂╂斁绛夌骇涓嬬殑缁樺埗楂樺害缂╂斁姣斾緥 + * @param {*} minH 褰撳墠鐩戞祴鏁版嵁鐨勬渶灏忛珮搴� + * @param {*} maxH 褰撳墠鐩戞祴鏁版嵁鐨勬渶澶ч珮搴� + */ +function _getScale(minH, maxH) { + var zoom = map.getZoom(); + if (_lastZoom == -1) { + _lastZoom = zoom; + } else if (_lastZoom <= 8) { + _lastZoom = zoom; + return; + } else if (_lastZoom >= 18) { + _lastZoom = zoom; + return; + } + if (zoom <= 8) { + _maxHeight = 10000; + _minHeight = 1000; + } else if (zoom <= 9) { + _maxHeight = 9000; + _minHeight = 900; + } else if (zoom <= 10) { + _maxHeight = 8000; + _minHeight = 800; + } else if (zoom <= 11) { + _maxHeight = 7000; + _minHeight = 700; + } else if (zoom <= 12) { + _maxHeight = 6000; + _minHeight = 600; + } else if (zoom <= 14) { + _maxHeight = 5000; + _minHeight = 500; + } else if (zoom <= 15) { + _maxHeight = 4500; + _minHeight = 450; + } else if (zoom <= 16) { + _maxHeight = 4000; + _minHeight = 400; + } else if (zoom <= 17) { + _maxHeight = 2500; + _minHeight = 250; + } else if (zoom > 17) { + _maxHeight = 1000; + _minHeight = 100; + } + + var scale = (_maxHeight - _minHeight) / (maxH - minH); + return scale; +} + +/** + * 缁樺浘 + */ +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; + 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); //搴曢儴椤剁偣 + geometry.vertices.push(p.x, p.y, 0 - h); //椤堕儴椤剁偣 + + 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); + } + } + + geometry.vertexColors.push.apply(geometry.vertexColors, bColors[i]); //搴曢儴椤剁偣棰滆壊 + geometry.vertexColors.push.apply(geometry.vertexColors, colors[i]); //椤堕儴椤剁偣棰滆壊 + } + + // 7.鏍规嵁鍚堝苟閫夐」閲嶇疆鎴栨柊澧炲綋鍓嶇紦瀛樻暟鎹� + if (merge != true) { + _factorDatas = fDatas; + _factor = factor; + if (_cylinder != undefined) { + object3Dlayer.remove(_cylinder); + } + } else { + // _factorDatas.lnglats.push.apply( + // _factorDatas.lnglats, + // lnglats_GD + // ); + // _factorDatas.coors.push.apply(_factorDatas.coors, coors); + // _factorDatas.heights.push.apply(_factorDatas.heights, heights); + // _factorDatas.colors.push.apply(_factorDatas.colors, colors); + // _factorDatas.bottomColor = bColor; + } + object3Dlayer.add(cylinder); + /**************test ****************/ + // object3Dlayer.on('mouseover', function (e) { + // console.log( + // `榧犳爣绉诲叆瑕嗙洊鐗�! [${e.lnglat.getlng()}, ${e.lnglat.getLat()}]` + // ); + // }); + /**************test ****************/ + _cylinder = cylinder; +} + +/** + * 缁樺埗楂樹寒鐨勬薄鏌撳尯鍩�3D绔嬮潰 + */ +var _polCylinderList = []; +var _polFactorDatasList = [], + //褰撳墠閫変腑鐨勭洃娴嬪洜瀛愭暟鎹� + _polFactorList = []; +function drawHighLight3DLayer(fDatas, factor) { + const offsetH = 100; + + 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, 1]; + // const color = [1, 0, 0, 0.75]; + geometry.vertexColors.push.apply(geometry.vertexColors, color); //搴曢儴椤剁偣棰滆壊 + geometry.vertexColors.push.apply(geometry.vertexColors, color); //椤堕儴椤剁偣棰滆壊 + } + + // 7.鏍规嵁鍚堝苟閫夐」閲嶇疆鎴栨柊澧炲綋鍓嶇紦瀛樻暟鎹� + _polFactorDatasList.push(fDatas); + _polFactorList.push(factor); + // if (_polCylinderList.length > 0) { + // _polCylinderList.forEach((p) => { + // object3Dlayer.remove(p); + // }); + // } + object3Dlayer.add(cylinder); + + _polCylinderList.push(cylinder); } export default { + clear() { + map.off('zoomend', onMapZoom); + if (_cylinder != undefined) { + object3Dlayer.remove(_cylinder); + } + if (_polCylinderList.length > 0) { + _polCylinderList.forEach((p) => { + object3Dlayer.remove(p); + }); + _polCylinderList = []; + } + _polFactorDatasList = []; + _polFactorList = []; + }, + + drawMesh: drawMesh, /** * 缁樺埗3D璧拌璺嚎鍥� * @param fDatas 瀹屾暣鐩戞祴鏁版嵁 - * @param factor 褰撳墠灞曠ず鐨勭洃娴嬪洜瀛愮殑鍊紇alue + * @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; // 1.鍏抽棴鍦板浘缂╂斁鐩戝惉 - map.off('zoomend', this._onMapZoom); + map.off('zoomend', onMapZoom); // 2.璁$畻缁樺浘楂樺害鐨勮竟鐣屽�� if (merge != true) { @@ -59,29 +289,17 @@ _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; - } - } - center = new AMap.LngLat(...p); - } - // 5.缁樺埗3D鍥惧舰 - drawMesh2(fDatas, factor, center, merge); + this.drawMesh(fDatas, factor, merge); // 缂╂斁鍦板浘鍒板悎閫傜殑瑙嗛噹绾у埆 // map.setFitView() // 6.寮�鍚湴鍥剧缉鏀剧洃鍚� if (lnglats_GD.length > 0) { - map.on('zoomend', this._onMapZoom); + map.on('zoomend', onMapZoom); } - } + }, + + drawHighLight3DLayer }; -- Gitblit v1.9.3