From 06eeb9b59644971d93e6dd9207ac447864e527b9 Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期二, 03 六月 2025 17:38:08 +0800 Subject: [PATCH] 动态溯源(待完成) --- src/utils/map/toolbox.js | 158 ++++++++++++++++++++++++++++++++++++++++++++++++++-- 1 files changed, 152 insertions(+), 6 deletions(-) diff --git a/src/utils/map/toolbox.js b/src/utils/map/toolbox.js index 0baffa5..3c24609 100644 --- a/src/utils/map/toolbox.js +++ b/src/utils/map/toolbox.js @@ -1,28 +1,174 @@ /* eslint-disable no-undef */ -import { map, satellite, controlbar } from './index_old'; -// import '@/lib/jquery-3.5.1.min'; +import { watch } from 'vue'; +import { map, satellite, onMapMounted } from './index_old'; +import { useToolboxStore } from '@/stores/toolbox'; +import { DialogUtil } from '@/utils/map/dialog'; + +const toolboxStore = useToolboxStore(); +watch( + () => toolboxStore.selectedDistrict, + (nV, oV) => { + if (nV != oV && toolboxStore.districtStatus) { + if (activeDistrict) map.remove(activeDistrict); + drawDistrict(toolboxStore.selectedDistrict); + } + } +); + +/** + * 鍧愭爣鎷惧彇榧犳爣鐐瑰嚮鍥炶皟浜嬩欢 + */ +var _locationMarker, _locationText; +function _coorPickListener(e) { + var text = `缁忓害: ${e.lnglat.getLng()}<br/>绾害: ${e.lnglat.getLat()}`; + if (_locationMarker == undefined) { + var textM = new AMap.Text({ + style: { + 'font-size': '12px' + }, + text: text, + position: e.lnglat, + offset: new AMap.Pixel(0, 30) + }); + + var marker = new AMap.Marker({ + position: e.lnglat + // icon: icon, + // anchor: 'top-center', + // content: '<i class="fa fa-map-marker fa-2x" style="color: #E6DB06;" aria-hidden="true"></i>' + }); + map.add(marker); + map.add(textM); + _locationMarker = marker; + _locationText = textM; + } else { + _locationMarker.setPosition(e.lnglat); + _locationText.setPosition(e.lnglat); + _locationText.setText(text); + } +} + +let districtPolygonMap = new Map(); +let activeDistrict = undefined; +// 缁樺埗鍖哄幙杈圭晫 +function drawDistrict(districtName, isNew) { + onMapMounted(() => { + if (!isNew && districtPolygonMap.has(districtName)) { + const districtPolygon = districtPolygonMap.get(districtName); + map.remove(districtPolygon); + map.add(districtPolygon); + activeDistrict = districtPolygon; + } else { + // eslint-disable-next-line no-undef + var district = new AMap.DistrictSearch({ + extensions: 'all', //杩斿洖琛屾斂鍖鸿竟鐣屽潗鏍囩瓑鍏蜂綋淇℃伅 + level: 'district' //璁剧疆鏌ヨ琛屾斂鍖虹骇鍒负鍖� + }); + district.search(districtName, function (status, result) { + var bounds = result.districtList[0].boundaries; //鑾峰彇鏈濋槼鍖虹殑杈圭晫淇℃伅 + if (bounds) { + for (var i = 0; i < bounds.length; i++) { + //鐢熸垚琛屾斂鍖哄垝 polygon + // eslint-disable-next-line no-undef + const districtPolygon = new AMap.Polygon({ + map: map, //鏄剧ず璇ヨ鐩栫墿鐨勫湴鍥惧璞� + strokeWeight: 1, //杞粨绾垮搴� + path: bounds[i], //澶氳竟褰㈣疆寤撶嚎鐨勮妭鐐瑰潗鏍囨暟缁� + fillOpacity: 0.6, //澶氳竟褰㈠~鍏呴�忔槑搴� + // fillColor: '#CCF3FF', //澶氳竟褰㈠~鍏呴鑹� + fillColor: '#0077ff', + // strokeColor: '#ffffff' //绾挎潯棰滆壊 + strokeColor: 'white', //绾挎潯棰滆壊 + zIndex: 9 + }); + + districtPolygonMap.set(districtName, districtPolygon); + activeDistrict = districtPolygon; + } + // map.setFitView(); //灏嗚鐩栫墿璋冩暣鍒板悎閫傝閲� + } + }); + } + }); +} export default { + /** + * 寮�鍏宠鏀垮尯鍒� + * @param {boolean} value + */ + toggleDistrict(value) { + if (value) { + if (toolboxStore.selectedDistrict) + drawDistrict(toolboxStore.selectedDistrict); + } else { + if (activeDistrict) map.remove(activeDistrict); + } + toolboxStore.districtStatus = value; + }, + /** * 寮�鍏冲湴鐗╂爣娉� * @param {boolean} value */ - toggleFeatures: (value) => { - value ? map.setFeatures(['bg', 'road', 'point', 'building']) : map.setFeatures(['bg', 'road']); + toggleFeatures(value) { + value + ? map.setFeatures(['bg', 'road', 'point', 'building']) + : map.setFeatures(['bg', 'road']); + toolboxStore.featuresStatus = value; }, /** * 寮�鍏冲崼鏄熷湴鍥� + * @param {boolean} value */ - toggleSatellite: (value) => { + toggleSatellite(value) { value ? satellite.show() : satellite.hide(); + toolboxStore.satelliteStatus = value; }, /** * 寮�鍏虫帶鍒剁綏鐩� + * @param {boolean} value */ - toggleControlbar: (value) => { + toggleControlbar(value) { // value ? controlbar.show() : controlbar.hide(); value ? $('.amap-controlbar').show() : $('.amap-controlbar').hide(); + toolboxStore.controlbarStatus = value; + }, + + /** + * 寮�鍏冲潗鏍囨嬀鍙� + * @param {boolean} value + */ + toggleCoorPicking(value) { + if (value) { + map.on('click', _coorPickListener); + } else { + map.off('click', _coorPickListener); + map.remove([_locationMarker, _locationText]); + _locationMarker = undefined; + _locationText = undefined; + } + toolboxStore.coorPickStatus = value; + }, + + /** + * 寮�鍏虫暟鎹脊妗� + */ + toggleDataDialogStatus(value) { + toolboxStore.dataDialogStatus = value; + if (value) { + DialogUtil.openWindow(); + } else { + DialogUtil.closeWindow(); + } + }, + + /** + * 寮�鍏虫函婧愭竻鍗� + */ + toggleSceneSearch(value) { + toolboxStore.sceneSearchStatus = value; } }; -- Gitblit v1.9.3