From 055c8329a8e8f7bc50bb1f10711031ea0bccaf2f Mon Sep 17 00:00:00 2001 From: wujingjing <gersonwu@qq.com> Date: 星期五, 17 一月 2025 10:30:18 +0800 Subject: [PATCH] 地图 --- src/model/map/GaoDeMap.ts | 32 +++++++++++++++++++++++--------- 1 files changed, 23 insertions(+), 9 deletions(-) diff --git a/src/model/map/GaoDeMap.ts b/src/model/map/GaoDeMap.ts index 5db0e9c..7901fa0 100644 --- a/src/model/map/GaoDeMap.ts +++ b/src/model/map/GaoDeMap.ts @@ -13,6 +13,8 @@ export type GaoDeMarkerOption = { icon: { url: string; + /** @description 閫変腑鏃剁殑鍥剧墖 */ + selectUrl?: string; size: number; }; click?: (e: any, labelMarker: AMap.LabelMarker) => void; @@ -32,6 +34,7 @@ export class GaoDeMap { map: AMap.Map; + AMap: AMapInstance; private viewBound: AMap.Bounds; async init(option: GaoDeMapOption) { const gaoDeOption = defaultsDeep(option, { @@ -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); @@ -104,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, @@ -138,17 +145,24 @@ 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; }); layer.add(markerList); this.map.add(layer); - } } -- Gitblit v1.9.3