From 20cdb83586daabfb15fc056c4c97eb8e7ccaf928 Mon Sep 17 00:00:00 2001
From: feiyu02 <risaku@163.com>
Date: 星期五, 20 三月 2026 17:07:16 +0800
Subject: [PATCH] 2026.3.20
---
src/utils/map/districtsearch.js | 113 +++++++++++++++++++++++++++++++++++++++++++++-----------
1 files changed, 90 insertions(+), 23 deletions(-)
diff --git a/src/utils/map/districtsearch.js b/src/utils/map/districtsearch.js
index dcba0a1..b41968b 100644
--- a/src/utils/map/districtsearch.js
+++ b/src/utils/map/districtsearch.js
@@ -1,26 +1,70 @@
-import { map, AMap, onMapMounted } from './index';
+import { map, AMap, onMapMounted } from './index'
// 琛屾斂鍖哄垝缂撳瓨
-var districtPolygonMap = new Map();
+var districtPolygonMap = new Map()
// 褰撳墠鏄剧ず鐨勫尯鍘�
-var activeDistrict = undefined;
+var activeDistrict = undefined
export default {
// 缁樺埗鍖哄幙杈圭晫
- drawDistrict(districtName, isNew) {
- if(!districtName) return;
+ drawDistrictMask(districtName, isNew) {
+ if (!districtName) return
onMapMounted(() => {
if (!isNew && districtPolygonMap.has(districtName)) {
- const districtPolygon = districtPolygonMap.get(districtName);
- map.add(districtPolygon);
- map.setFitView(districtPolygon);
- activeDistrict = districtPolygon;
+ const { polygon, mask } = districtPolygonMap.get(districtName)
+ map.add(polygon)
+ map.setFitView(polygon)
+ map.setMask(mask)
+ activeDistrict = polygon
} else {
var district = new AMap.DistrictSearch({
extensions: 'all', //杩斿洖琛屾斂鍖鸿竟鐣屽潗鏍囩瓑鍏蜂綋淇℃伅
- level: 'district' //璁剧疆鏌ヨ琛屾斂鍖虹骇鍒负鍖�
- });
+ level: 'district', //璁剧疆鏌ヨ琛屾斂鍖虹骇鍒负鍖�
+ })
district.search(districtName, function (status, result) {
- var bounds = result.districtList[0].boundaries; //鑾峰彇杈圭晫淇℃伅
+ if (status === 'complete') {
+ var bounds = result.districtList[0].boundaries //鑾峰彇杈圭晫淇℃伅
+ var mask = []
+ var polygon = []
+ for (var i = 0; i < bounds.length; i++) {
+ mask.push([bounds[i]])
+
+ //鐢熸垚琛屾斂鍖哄垝 polygon
+ const districtPolygon = new AMap.Polygon({
+ map: map, //鏄剧ず璇ヨ鐩栫墿鐨勫湴鍥惧璞�
+ strokeWeight: 2, //杞粨绾垮搴�
+ path: bounds[i], //澶氳竟褰㈣疆寤撶嚎鐨勮妭鐐瑰潗鏍囨暟缁�
+ fillOpacity: 0, //澶氳竟褰㈠～鍏呴�忔槑搴�
+ fillColor: '#0077ff',
+ strokeColor: '#99ffff', //绾挎潯棰滆壊
+ })
+
+ polygon.push(districtPolygon)
+ }
+ activeDistrict = polygon
+ districtPolygonMap.set(districtName, { polygon, mask })
+ map.setFitView(polygon, true)
+ map.setMask(mask)
+ }
+ })
+ }
+ })
+ },
+ // 缁樺埗鍖哄幙杈圭晫
+ drawDistrict(districtName, isNew) {
+ if (!districtName) return
+ onMapMounted(() => {
+ if (!isNew && districtPolygonMap.has(districtName)) {
+ const districtPolygon = districtPolygonMap.get(districtName)
+ map.add(districtPolygon)
+ map.setFitView(districtPolygon)
+ activeDistrict = districtPolygon
+ } else {
+ 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
@@ -30,24 +74,47 @@
path: bounds[i], //澶氳竟褰㈣疆寤撶嚎鐨勮妭鐐瑰潗鏍囨暟缁�
fillOpacity: 0.4, //澶氳竟褰㈠～鍏呴�忔槑搴�
fillColor: '#0077ff',
- strokeColor: '#CC66CC' //绾挎潯棰滆壊
- });
+ strokeColor: '#CC66CC', //绾挎潯棰滆壊
+ })
- districtPolygonMap.set(districtName, districtPolygon);
- activeDistrict = districtPolygon;
- map.setFitView(districtPolygon, true);
+ districtPolygonMap.set(districtName, districtPolygon)
+ activeDistrict = districtPolygon
+ map.setFitView(districtPolygon, true)
}
}
- });
+ })
}
- });
+ })
},
removeDistrict() {
onMapMounted(() => {
if (activeDistrict) {
- map.remove(activeDistrict);
- activeDistrict = undefined;
+ map.remove(activeDistrict)
+ activeDistrict = undefined
}
})
- }
-};
+ },
+ districtLayer(districtName) {
+ onMapMounted(() => {
+ //2銆佸垱寤虹渷甯傜畝鏄撹鏀垮尯鍥惧眰
+ var distProvince = new AMap.DistrictLayer.Province({
+ zIndex: 10, //璁剧疆鍥惧眰灞傜骇
+ zooms: [2, 15], //璁剧疆鍥惧眰鏄剧ず鑼冨洿
+ adcode: districtName, //璁剧疆琛屾斂鍖� adcode
+ depth: 2, //璁剧疆鏁版嵁鏄剧ず灞傜骇锛�0锛氭樉绀哄浗瀹堕潰锛�1锛氭樉绀虹渷绾э紝褰撳浗瀹朵负涓浗鏃惰缃甦epth涓�2鐨勫彲浠ユ樉绀哄競涓�绾�
+ })
+ // 3銆佽缃鏀垮尯鍥惧眰鏍峰紡
+ distProvince.setStyles({
+ 'stroke-width': 2, //鎻忚竟绾垮
+ fill: function (data) {
+ //璁剧疆鍖哄煙濉厖棰滆壊锛屽彲鏍规嵁鍥炶皟淇℃伅杩斿洖鍖哄煙淇℃伅璁剧疆涓嶅悓濉厖鑹�
+ //鍥炶皟杩斿洖鍖哄煙淇℃伅鏁版嵁锛屽瓧娈靛寘鎷� SOC(鍥藉浠ｇ爜)銆丯AME_ENG(鑻辨枃鍚嶇О)銆丯AME_CHN(涓枃鍚嶇О)绛�
+ //鍥藉浠ｇ爜鍚嶇О璇存槑鍙傝�� https://a.amap.com/jsapi_demos/static/demo-center/js/soc-list.json
+ return '#ffffffe7'
+ },
+ })
+ //4銆佸皢绠�鏄撹鏀垮尯鍥惧眰娣诲姞鍒板湴鍥�
+ map.add(distProvince)
+ })
+ },
+}
--
Gitblit v1.9.3