From 8c6fbc506e9a2c8cde56a794d8319cc55f4be666 Mon Sep 17 00:00:00 2001
From: wujingjing <gersonwu@qq.com>
Date: 星期二, 11 二月 2025 15:56:48 +0800
Subject: [PATCH] 修复问题
---
src/model/map/GaoDeMap.ts | 37 ++++++++++++++++++++++++++-----------
1 files changed, 26 insertions(+), 11 deletions(-)
diff --git a/src/model/map/GaoDeMap.ts b/src/model/map/GaoDeMap.ts
index 695b6c7..7901fa0 100644
--- a/src/model/map/GaoDeMap.ts
+++ b/src/model/map/GaoDeMap.ts
@@ -1,5 +1,5 @@
import AMapLoader from '@amap/amap-jsapi-loader';
-import _ from 'lodash';
+import { defaultsDeep } from 'lodash-es';
export type AMapInstance = typeof AMap;
export type GaoDePosition = [number, number];
export type GaoDeMapOption = {
@@ -13,6 +13,8 @@
export type GaoDeMarkerOption = {
icon: {
url: string;
+ /** @description 閫変腑鏃剁殑鍥剧墖 */
+ selectUrl?: string;
size: number;
};
click?: (e: any, labelMarker: AMap.LabelMarker) => void;
@@ -32,9 +34,10 @@
export class GaoDeMap {
map: AMap.Map;
+ AMap: AMapInstance;
private viewBound: AMap.Bounds;
async init(option: GaoDeMapOption) {
- const gaoDeOption = _.defaultsDeep(option, {
+ const gaoDeOption = defaultsDeep(option, {
key: '3627ed9deaac2622e26a7169f0c36b1b', // 鐢宠濂界殑Web绔紑鍙戣�匥ey锛岄娆¤皟鐢� load 鏃跺繀濉�
version: '2.0', // 鎸囧畾瑕佸姞杞界殑 JSAPI 鐨勭増鏈紝缂虹渷鏃堕粯璁や负 1.4.15
plugins: [
@@ -46,7 +49,9 @@
// 'AMap.MarkerCluster',
// 'AMap.InfoWindow',
], // 闇�瑕佷娇鐢ㄧ殑鐨勬彃浠跺垪琛紝濡傛瘮渚嬪昂'AMap.Scale'绛�
-
+ // AMapUI:{
+ // version: '1.1',
+ // },
aMapOption: {
viewMode: '2D', //榛樿浣跨敤 2D 妯″紡
zoom: 5, //鍦板浘绾у埆
@@ -54,12 +59,13 @@
} as Partial<AMap.MapOptions>,
} as Partial<GaoDeMapOption>) as GaoDeMapOption;
try {
- const AMap = await AMapLoader.load({
+ this.AMap = await AMapLoader.load({
key: gaoDeOption.key,
version: gaoDeOption.version,
plugins: gaoDeOption.plugins,
});
- this.map = new AMap.Map(gaoDeOption.container, gaoDeOption.aMapOption);
+
+ this.map = new this.AMap.Map(gaoDeOption.container, gaoDeOption.aMapOption);
this.setStyle();
} catch (error) {
// console.error(error);
@@ -74,7 +80,6 @@
*/
container.querySelector('.amap-logo').style.opacity = 0;
container.querySelector('.amap-copyright').style.opacity = 0;
-
}
zoomToRect(southWest: GaoDePosition, northEast: GaoDePosition) {
@@ -95,7 +100,7 @@
}
addMarkerLayer(dataList: LabelMarkerData[], option: MarkerLayerOption) {
- const markerLayerOption = _.defaultsDeep(option, {
+ const markerLayerOption = defaultsDeep(option, {
layerOpt: {
zooms: [3, 20],
zIndex: 1000,
@@ -105,8 +110,9 @@
const layer = new AMap.LabelsLayer(markerLayerOption.layerOpt);
const { markerOpt } = markerLayerOption;
+ const { icon } = markerOpt;
+
const convertData = (dataList ?? []).map<AMap.LabelMarkerOptions>((item) => {
- const { icon } = markerOpt;
return {
// name: '鑷彁鐐�9',
position: item.position,
@@ -139,11 +145,20 @@
extData: item.extData,
};
});
+
const markerList = convertData.map((item) => {
const label = new AMap.LabelMarker(item);
- if (markerOpt.click) {
- label.on('click', (e) => markerOpt.click(e, label));
- }
+
+ label.on('click', (e) => {
+ if (icon.selectUrl) {
+ setTimeout(() => {
+ label.setIcon({
+ image: icon.selectUrl,
+ });
+ }, 30);
+ }
+ markerOpt.click?.(e, label);
+ });
return label;
});
--
Gitblit v1.9.3