expo-gaode-map 1.0.1 → 1.0.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +1 -0
- package/android/src/main/java/expo/modules/gaodemap/ExpoGaodeMapModule.kt +17 -1
- package/android/src/main/java/expo/modules/gaodemap/ExpoGaodeMapView.kt +52 -5
- package/android/src/main/java/expo/modules/gaodemap/managers/OverlayManager.kt +184 -6
- package/android/src/main/java/expo/modules/gaodemap/overlays/CircleView.kt +24 -51
- package/android/src/main/java/expo/modules/gaodemap/overlays/MarkerView.kt +3 -0
- package/build/ExpoGaodeMap.types.d.ts.map +1 -1
- package/build/ExpoGaodeMap.types.js +0 -10
- package/build/ExpoGaodeMap.types.js.map +1 -1
- package/build/ExpoGaodeMapModule.d.ts.map +1 -1
- package/build/ExpoGaodeMapModule.js +0 -10
- package/build/ExpoGaodeMapModule.js.map +1 -1
- package/build/ExpoGaodeMapView.d.ts +39 -20
- package/build/ExpoGaodeMapView.d.ts.map +1 -1
- package/build/ExpoGaodeMapView.js +215 -31
- package/build/ExpoGaodeMapView.js.map +1 -1
- package/build/components/overlays/Circle.d.ts +0 -15
- package/build/components/overlays/Circle.d.ts.map +1 -1
- package/build/components/overlays/Circle.js +28 -46
- package/build/components/overlays/Circle.js.map +1 -1
- package/build/components/overlays/Cluster.d.ts +3 -15
- package/build/components/overlays/Cluster.d.ts.map +1 -1
- package/build/components/overlays/Cluster.js +3 -25
- package/build/components/overlays/Cluster.js.map +1 -1
- package/build/components/overlays/HeatMap.d.ts +3 -14
- package/build/components/overlays/HeatMap.d.ts.map +1 -1
- package/build/components/overlays/HeatMap.js +3 -24
- package/build/components/overlays/HeatMap.js.map +1 -1
- package/build/components/overlays/Marker.d.ts +2 -15
- package/build/components/overlays/Marker.d.ts.map +1 -1
- package/build/components/overlays/Marker.js +60 -46
- package/build/components/overlays/Marker.js.map +1 -1
- package/build/components/overlays/MultiPoint.d.ts +3 -14
- package/build/components/overlays/MultiPoint.d.ts.map +1 -1
- package/build/components/overlays/MultiPoint.js +3 -24
- package/build/components/overlays/MultiPoint.js.map +1 -1
- package/build/components/overlays/Polygon.d.ts +13 -16
- package/build/components/overlays/Polygon.d.ts.map +1 -1
- package/build/components/overlays/Polygon.js +41 -75
- package/build/components/overlays/Polygon.js.map +1 -1
- package/build/components/overlays/Polyline.d.ts +12 -14
- package/build/components/overlays/Polyline.d.ts.map +1 -1
- package/build/components/overlays/Polyline.js +34 -35
- package/build/components/overlays/Polyline.js.map +1 -1
- package/build/components/overlays/index.d.ts.map +1 -1
- package/build/components/overlays/index.js +0 -10
- package/build/components/overlays/index.js.map +1 -1
- package/build/index.d.ts.map +1 -1
- package/build/index.js +0 -10
- package/build/index.js.map +1 -1
- package/build/modules/AMapLocation.d.ts +47 -10
- package/build/modules/AMapLocation.d.ts.map +1 -1
- package/build/modules/AMapLocation.js +48 -20
- package/build/modules/AMapLocation.js.map +1 -1
- package/build/modules/AMapPermissions.d.ts +3 -1
- package/build/modules/AMapPermissions.d.ts.map +1 -1
- package/build/modules/AMapPermissions.js +3 -11
- package/build/modules/AMapPermissions.js.map +1 -1
- package/build/modules/AMapSDK.d.ts +5 -4
- package/build/modules/AMapSDK.d.ts.map +1 -1
- package/build/modules/AMapSDK.js +5 -14
- package/build/modules/AMapSDK.js.map +1 -1
- package/build/modules/AMapView.d.ts.map +1 -1
- package/build/modules/AMapView.js +0 -8
- package/build/modules/AMapView.js.map +1 -1
- package/build/types/index.d.ts.map +1 -1
- package/build/types/index.js +0 -10
- package/build/types/index.js.map +1 -1
- package/build/types/map-view.types.d.ts +30 -0
- package/build/types/map-view.types.d.ts.map +1 -1
- package/build/types/map-view.types.js.map +1 -1
- package/build/types/overlays.types.d.ts +25 -1
- package/build/types/overlays.types.d.ts.map +1 -1
- package/build/types/overlays.types.js.map +1 -1
- package/docs/API.md +40 -0
- package/docs/EXAMPLES.md +86 -2
- package/docs/RELEASE_GUIDE.md +178 -0
- package/expo-module.config.json +1 -1
- package/ios/ExpoGaodeMapModule.swift +42 -14
- package/ios/ExpoGaodeMapView.swift +210 -7
- package/ios/managers/OverlayManager.swift +78 -10
- package/ios/overlays/CircleView.swift +41 -12
- package/ios/overlays/MarkerView.swift +55 -3
- package/ios/overlays/PolygonView.swift +25 -5
- package/ios/overlays/PolylineView.swift +23 -4
- package/ios/utils/ColorParser.swift +0 -5
- package/package.json +1 -1
- package/src/ExpoGaodeMap.types.ts +1 -10
- package/src/ExpoGaodeMapModule.ts +1 -10
- package/src/ExpoGaodeMapView.tsx +257 -38
- package/src/components/overlays/Circle.tsx +32 -50
- package/src/components/overlays/Cluster.tsx +4 -26
- package/src/components/overlays/HeatMap.tsx +4 -25
- package/src/components/overlays/Marker.tsx +69 -52
- package/src/components/overlays/MultiPoint.tsx +4 -25
- package/src/components/overlays/Polygon.tsx +48 -78
- package/src/components/overlays/Polyline.tsx +41 -38
- package/src/components/overlays/index.ts +0 -11
- package/src/index.ts +0 -11
- package/src/modules/AMapLocation.ts +56 -20
- package/src/modules/AMapPermissions.ts +4 -11
- package/src/modules/AMapSDK.ts +7 -14
- package/src/modules/AMapView.ts +0 -8
- package/src/types/index.ts +1 -10
- package/src/types/map-view.types.ts +25 -0
- package/src/types/overlays.types.ts +30 -1
|
@@ -1,66 +1,83 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-13 15:01:10
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-13 18:55:00
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/components/overlays/Marker.tsx
|
|
7
|
-
* @Description : 地图标记组件 - 使用命令式 API
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
1
|
import * as React from 'react';
|
|
13
|
-
import {
|
|
2
|
+
import { Image } from 'react-native';
|
|
3
|
+
import { MapContext, MarkerEventContext } from '../../ExpoGaodeMapView';
|
|
14
4
|
import type { MarkerProps } from '../../types';
|
|
15
5
|
|
|
16
|
-
/**
|
|
17
|
-
* 地图标记组件
|
|
18
|
-
*
|
|
19
|
-
* @example
|
|
20
|
-
* ```tsx
|
|
21
|
-
* <MapView>
|
|
22
|
-
* <Marker
|
|
23
|
-
* position={{ latitude: 39.9, longitude: 116.4 }}
|
|
24
|
-
* title="标记点"
|
|
25
|
-
* onPress={() => console.log('Marker pressed')}
|
|
26
|
-
* />
|
|
27
|
-
* </MapView>
|
|
28
|
-
* ```
|
|
29
|
-
*/
|
|
30
6
|
export default function Marker(props: MarkerProps) {
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
console.log('Marker 组件渲染,props:', props);
|
|
7
|
+
return <MarkerImperative {...props} />;
|
|
8
|
+
}
|
|
35
9
|
|
|
36
|
-
|
|
10
|
+
function MarkerImperative(props: MarkerProps) {
|
|
11
|
+
const mapRef = React.useContext(MapContext);
|
|
12
|
+
const eventManager = React.useContext(MarkerEventContext);
|
|
13
|
+
const markerIdRef = React.useRef<string | null>(null);
|
|
14
|
+
const propsRef = React.useRef(props);
|
|
15
|
+
|
|
16
|
+
React.useEffect(() => {
|
|
17
|
+
propsRef.current = props;
|
|
18
|
+
}, [props]);
|
|
19
|
+
|
|
37
20
|
React.useEffect(() => {
|
|
38
|
-
const
|
|
21
|
+
const checkAndAdd = () => {
|
|
22
|
+
if (!mapRef?.current) {
|
|
23
|
+
setTimeout(checkAndAdd, 50);
|
|
24
|
+
return;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
const markerId = `marker_${Date.now()}_${Math.random()}`;
|
|
28
|
+
markerIdRef.current = markerId;
|
|
29
|
+
|
|
30
|
+
if (eventManager) {
|
|
31
|
+
eventManager.register(markerId, {
|
|
32
|
+
onPress: props.onPress,
|
|
33
|
+
onDragStart: props.onDragStart,
|
|
34
|
+
onDrag: props.onDrag,
|
|
35
|
+
onDragEnd: props.onDragEnd,
|
|
36
|
+
});
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
const processedProps = { ...propsRef.current };
|
|
40
|
+
if (processedProps.icon && typeof processedProps.icon === 'number') {
|
|
41
|
+
const resolved = Image.resolveAssetSource(processedProps.icon);
|
|
42
|
+
processedProps.icon = resolved;
|
|
43
|
+
}
|
|
44
|
+
|
|
45
|
+
mapRef.current.addMarker(markerId, processedProps);
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
checkAndAdd();
|
|
39
49
|
|
|
40
|
-
console.log('Marker useEffect - 添加标记到地图');
|
|
41
|
-
mapRef?.current?.addMarker?.(markerId, props).then(() => {
|
|
42
|
-
console.log('✅ 标记已添加:', markerId);
|
|
43
|
-
}).catch((error: any) => {
|
|
44
|
-
console.error('❌ 添加标记失败:', error);
|
|
45
|
-
});
|
|
46
|
-
|
|
47
50
|
return () => {
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
51
|
+
if (markerIdRef.current) {
|
|
52
|
+
if (eventManager) {
|
|
53
|
+
eventManager.unregister(markerIdRef.current);
|
|
54
|
+
}
|
|
55
|
+
if (mapRef?.current) {
|
|
56
|
+
mapRef.current.removeMarker(markerIdRef.current);
|
|
57
|
+
}
|
|
58
|
+
}
|
|
52
59
|
};
|
|
53
60
|
}, []);
|
|
54
61
|
|
|
55
|
-
// 监听 Props 变化,更新标记
|
|
56
62
|
React.useEffect(() => {
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
63
|
+
if (markerIdRef.current && mapRef?.current) {
|
|
64
|
+
const processedProps = { ...props };
|
|
65
|
+
if (processedProps.icon && typeof processedProps.icon === 'number') {
|
|
66
|
+
const resolved = Image.resolveAssetSource(processedProps.icon);
|
|
67
|
+
processedProps.icon = resolved;
|
|
68
|
+
}
|
|
69
|
+
mapRef.current.updateMarker(markerIdRef.current, processedProps);
|
|
70
|
+
}
|
|
71
|
+
}, [
|
|
72
|
+
props.position?.latitude,
|
|
73
|
+
props.position?.longitude,
|
|
74
|
+
props.title,
|
|
75
|
+
props.draggable,
|
|
76
|
+
props.icon,
|
|
77
|
+
props.iconWidth,
|
|
78
|
+
props.iconHeight,
|
|
79
|
+
props.pinColor
|
|
80
|
+
]);
|
|
81
|
+
|
|
65
82
|
return null;
|
|
66
83
|
}
|
|
@@ -1,36 +1,15 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-13 15:02:35
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-13 18:19:09
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/components/overlays/MultiPoint.tsx
|
|
7
|
-
* @Description : 地图海量点组件
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
1
|
import { requireNativeViewManager } from 'expo-modules-core';
|
|
13
2
|
import * as React from 'react';
|
|
14
3
|
import type { MultiPointProps } from '../../types';
|
|
15
4
|
|
|
16
5
|
const NativeMultiPoint = requireNativeViewManager('ExpoGaodeMap_MultiPointView');
|
|
17
6
|
|
|
7
|
+
|
|
18
8
|
/**
|
|
19
|
-
*
|
|
20
|
-
* 用于展示大量标记点,性能优于普通 Marker
|
|
9
|
+
* 高德地图多点标记组件
|
|
21
10
|
*
|
|
22
|
-
* @
|
|
23
|
-
*
|
|
24
|
-
* <MapView>
|
|
25
|
-
* <MultiPoint
|
|
26
|
-
* points={[
|
|
27
|
-
* { latitude: 39.9, longitude: 116.4, id: '1' },
|
|
28
|
-
* { latitude: 39.91, longitude: 116.41, id: '2' },
|
|
29
|
-
* ]}
|
|
30
|
-
* icon={require('./marker.png')}
|
|
31
|
-
* />
|
|
32
|
-
* </MapView>
|
|
33
|
-
* ```
|
|
11
|
+
* @param props 多点标记的配置属性,继承自MultiPointProps接口
|
|
12
|
+
* @returns 渲染原生高德地图多点标记组件
|
|
34
13
|
*/
|
|
35
14
|
export default function MultiPoint(props: MultiPointProps) {
|
|
36
15
|
return <NativeMultiPoint {...props} />;
|
|
@@ -1,105 +1,75 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-13 15:01:45
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-13 19:24:22
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/components/overlays/Polygon.tsx
|
|
7
|
-
* @Description : 地图多边形组件 - 命令式 API
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
|
-
|
|
13
1
|
import { useContext, useEffect, useRef } from 'react';
|
|
14
2
|
import type { PolygonProps } from '../../types';
|
|
15
3
|
import { MapContext } from '../../ExpoGaodeMapView';
|
|
16
4
|
|
|
5
|
+
|
|
17
6
|
/**
|
|
18
|
-
*
|
|
7
|
+
* 高德地图多边形覆盖物组件
|
|
8
|
+
*
|
|
9
|
+
* @param props - 多边形配置属性
|
|
10
|
+
* @param props.points - 多边形顶点坐标数组,至少需要3个点
|
|
11
|
+
* @param props.fillColor - 多边形填充颜色,十六进制格式,默认0x440000FF
|
|
12
|
+
* @param props.strokeColor - 多边形边框颜色,默认-16776961
|
|
13
|
+
* @param props.strokeWidth - 多边形边框宽度,默认10
|
|
14
|
+
* @param props.zIndex - 多边形层级,默认0
|
|
19
15
|
*
|
|
20
|
-
* @
|
|
21
|
-
*
|
|
22
|
-
*
|
|
23
|
-
*
|
|
24
|
-
*
|
|
25
|
-
* { latitude: 39.9, longitude: 116.4 },
|
|
26
|
-
* { latitude: 39.91, longitude: 116.41 },
|
|
27
|
-
* { latitude: 39.92, longitude: 116.40 },
|
|
28
|
-
* ]}
|
|
29
|
-
* fillColor={0x44FF0000}
|
|
30
|
-
* strokeColor={-65536}
|
|
31
|
-
* strokeWidth={5}
|
|
32
|
-
* />
|
|
33
|
-
* </MapView>
|
|
34
|
-
* ```
|
|
16
|
+
* @remarks
|
|
17
|
+
* 组件内部会自动生成唯一ID用于标识多边形,并在组件挂载时添加到地图,
|
|
18
|
+
* 更新时同步修改多边形属性,卸载时自动移除多边形。
|
|
19
|
+
*
|
|
20
|
+
* 注意:points数组长度必须大于等于3才能有效绘制多边形。
|
|
35
21
|
*/
|
|
36
22
|
export default function Polygon(props: PolygonProps) {
|
|
37
23
|
const { points, fillColor, strokeColor, strokeWidth, zIndex } = props;
|
|
38
24
|
const nativeRef = useContext(MapContext);
|
|
39
|
-
const polygonIdRef = useRef<string>(
|
|
40
|
-
|
|
25
|
+
const polygonIdRef = useRef<string | null>(null);
|
|
26
|
+
const propsRef = useRef(props);
|
|
27
|
+
|
|
41
28
|
useEffect(() => {
|
|
42
|
-
|
|
29
|
+
propsRef.current = props;
|
|
30
|
+
}, [props]);
|
|
43
31
|
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
32
|
+
useEffect(() => {
|
|
33
|
+
const checkAndAdd = () => {
|
|
34
|
+
if (!nativeRef?.current) {
|
|
35
|
+
setTimeout(checkAndAdd, 50);
|
|
36
|
+
return;
|
|
37
|
+
}
|
|
38
|
+
|
|
39
|
+
const polygonId = `polygon_${Date.now()}_${Math.random()}`;
|
|
40
|
+
polygonIdRef.current = polygonId;
|
|
41
|
+
|
|
42
|
+
const { points, fillColor, strokeColor, strokeWidth, zIndex } = propsRef.current;
|
|
43
|
+
|
|
44
|
+
if (points && points.length >= 3) {
|
|
55
45
|
nativeRef.current.addPolygon(polygonId, {
|
|
56
46
|
points,
|
|
57
|
-
fillColor: fillColor ??
|
|
58
|
-
strokeColor: strokeColor ??
|
|
47
|
+
fillColor: fillColor ?? '#880000FF',
|
|
48
|
+
strokeColor: strokeColor ?? '#FFFF0000',
|
|
59
49
|
strokeWidth: strokeWidth ?? 10,
|
|
60
50
|
zIndex: zIndex ?? 0,
|
|
61
51
|
});
|
|
62
|
-
|
|
63
|
-
console.log('✅ Polygon addPolygon 调用完成');
|
|
64
|
-
} catch (error) {
|
|
65
|
-
console.error('❌ 添加多边形失败:', error);
|
|
66
52
|
}
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
pointsLength: points?.length,
|
|
72
|
-
});
|
|
73
|
-
}
|
|
74
|
-
|
|
75
|
-
// 清理函数
|
|
53
|
+
};
|
|
54
|
+
|
|
55
|
+
checkAndAdd();
|
|
56
|
+
|
|
76
57
|
return () => {
|
|
77
|
-
if (nativeRef?.current) {
|
|
78
|
-
|
|
79
|
-
nativeRef.current.removePolygon(polygonId);
|
|
80
|
-
} catch (error) {
|
|
81
|
-
console.error('移除多边形失败:', error);
|
|
82
|
-
}
|
|
58
|
+
if (polygonIdRef.current && nativeRef?.current) {
|
|
59
|
+
nativeRef.current.removePolygon(polygonIdRef.current);
|
|
83
60
|
}
|
|
84
61
|
};
|
|
85
62
|
}, []);
|
|
86
63
|
|
|
87
|
-
// 更新多边形属性
|
|
88
64
|
useEffect(() => {
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
strokeWidth,
|
|
98
|
-
zIndex,
|
|
99
|
-
});
|
|
100
|
-
} catch (error) {
|
|
101
|
-
console.error('更新多边形失败:', error);
|
|
102
|
-
}
|
|
65
|
+
if (polygonIdRef.current && nativeRef?.current) {
|
|
66
|
+
nativeRef.current.updatePolygon(polygonIdRef.current, {
|
|
67
|
+
points,
|
|
68
|
+
fillColor,
|
|
69
|
+
strokeColor,
|
|
70
|
+
strokeWidth,
|
|
71
|
+
zIndex,
|
|
72
|
+
});
|
|
103
73
|
}
|
|
104
74
|
}, [points, fillColor, strokeColor, strokeWidth, zIndex]);
|
|
105
75
|
|
|
@@ -1,56 +1,59 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-13 15:01:30
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-15 01:08:27
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/components/overlays/Polyline.tsx
|
|
7
|
-
* @Description : 地图折线组件 - 使用命令式 API
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
11
1
|
|
|
12
2
|
import * as React from 'react';
|
|
13
3
|
import { MapContext } from '../../ExpoGaodeMapView';
|
|
14
4
|
import type { PolylineProps } from '../../types';
|
|
15
5
|
|
|
6
|
+
|
|
16
7
|
/**
|
|
17
|
-
*
|
|
8
|
+
* Polyline 组件用于在高德地图上绘制折线
|
|
18
9
|
*
|
|
19
|
-
* @
|
|
20
|
-
*
|
|
21
|
-
*
|
|
22
|
-
*
|
|
23
|
-
*
|
|
24
|
-
*
|
|
25
|
-
*
|
|
26
|
-
*
|
|
27
|
-
*
|
|
28
|
-
*
|
|
29
|
-
*
|
|
30
|
-
* </MapView>
|
|
31
|
-
* ```
|
|
10
|
+
* @param props - 折线的配置属性
|
|
11
|
+
* @param props.points - 折线的坐标点数组
|
|
12
|
+
* @param props.width - 折线的宽度(像素)
|
|
13
|
+
* @param props.color - 折线的颜色(十六进制或RGBA)
|
|
14
|
+
* @param [props.texture] - 可选,折线的纹理样式
|
|
15
|
+
*
|
|
16
|
+
* @remarks
|
|
17
|
+
* 组件内部使用 React 的 useEffect 钩子来管理折线的生命周期:
|
|
18
|
+
* 1. 组件挂载时创建折线并添加到地图
|
|
19
|
+
* 2. 组件卸载时自动从地图移除折线
|
|
20
|
+
* 3. 使用 ref 保存折线ID以便清理
|
|
32
21
|
*/
|
|
33
22
|
export default function Polyline(props: PolylineProps) {
|
|
34
23
|
const mapRef = React.useContext(MapContext);
|
|
35
24
|
const polylineIdRef = React.useRef<string | null>(null);
|
|
36
|
-
|
|
37
|
-
|
|
25
|
+
const propsRef = React.useRef(props);
|
|
26
|
+
|
|
38
27
|
React.useEffect(() => {
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
const
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
28
|
+
propsRef.current = props;
|
|
29
|
+
}, [props]);
|
|
30
|
+
|
|
31
|
+
React.useEffect(() => {
|
|
32
|
+
const checkAndAdd = () => {
|
|
33
|
+
if (!mapRef?.current) {
|
|
34
|
+
setTimeout(checkAndAdd, 50);
|
|
35
|
+
return;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
const polylineId = `polyline_${Date.now()}_${Math.random()}`;
|
|
39
|
+
polylineIdRef.current = polylineId;
|
|
40
|
+
|
|
41
|
+
const polylineProps = {
|
|
42
|
+
points: propsRef.current.points,
|
|
43
|
+
width: propsRef.current.width,
|
|
44
|
+
color: propsRef.current.color,
|
|
45
|
+
...(propsRef.current.texture && { texture: propsRef.current.texture }),
|
|
46
|
+
};
|
|
47
|
+
|
|
48
|
+
mapRef.current.addPolyline(polylineId, polylineProps);
|
|
48
49
|
};
|
|
49
50
|
|
|
50
|
-
|
|
51
|
-
|
|
51
|
+
checkAndAdd();
|
|
52
|
+
|
|
52
53
|
return () => {
|
|
53
|
-
mapRef?.current
|
|
54
|
+
if (polylineIdRef.current && mapRef?.current) {
|
|
55
|
+
mapRef.current.removePolyline(polylineIdRef.current);
|
|
56
|
+
}
|
|
54
57
|
};
|
|
55
58
|
}, []);
|
|
56
59
|
|
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-13 15:03:10
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-13 15:03:22
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/components/overlays/index.ts
|
|
7
|
-
* @Description : 覆盖物组件统一导出
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
1
|
export { default as Marker } from './Marker';
|
|
13
2
|
export { default as Polyline } from './Polyline';
|
|
14
3
|
export { default as Polygon } from './Polygon';
|
package/src/index.ts
CHANGED
|
@@ -1,14 +1,3 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-13 14:45:15
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-15 02:21:17
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/index.ts
|
|
7
|
-
* @Description : 高德地图 Expo Module 主导出文件
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
11
|
-
|
|
12
1
|
// 导出类型定义
|
|
13
2
|
export * from './ExpoGaodeMap.types';
|
|
14
3
|
export * from './types';
|
|
@@ -1,13 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-13 14:42:10
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-13 14:42:15
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/modules/AMapLocation.ts
|
|
7
|
-
* @Description : 高德地图定位模块
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
1
|
+
//高德地图定位模块
|
|
11
2
|
|
|
12
3
|
import { EventSubscription } from 'expo-modules-core';
|
|
13
4
|
import ExpoGaodeMapModule from '../ExpoGaodeMapModule';
|
|
@@ -21,7 +12,26 @@ import type {
|
|
|
21
12
|
} from '../types';
|
|
22
13
|
|
|
23
14
|
/**
|
|
24
|
-
*
|
|
15
|
+
* 配置高德地图定位服务的各项参数
|
|
16
|
+
* @param {LocationOptions} options - 定位配置选项对象
|
|
17
|
+
* @param {boolean} [options.withReGeocode] - 是否返回逆地理编码信息
|
|
18
|
+
* @param {number} [options.accuracy] - 定位精度设置
|
|
19
|
+
* @param {string} [options.mode] - 定位模式
|
|
20
|
+
* @param {boolean} [options.onceLocation] - 是否单次定位
|
|
21
|
+
* @param {number} [options.interval] - 定位间隔(毫秒)
|
|
22
|
+
* @param {number} [options.timeout] - 定位超时时间(毫秒)
|
|
23
|
+
* @param {number} [options.reGeocodeTimeout] - 逆地理编码超时时间(毫秒)
|
|
24
|
+
* @param {number} [options.distanceFilter] - 位置更新最小距离(米)
|
|
25
|
+
* @param {boolean} [options.sensorEnable] - 是否启用传感器
|
|
26
|
+
* @param {boolean} [options.wifiScan] - 是否开启WiFi扫描
|
|
27
|
+
* @param {boolean} [options.gpsFirst] - 是否优先使用GPS
|
|
28
|
+
* @param {boolean} [options.onceLocationLatest] - 是否获取最近3秒内最精确的位置
|
|
29
|
+
* @param {string} [options.geoLanguage] - 地理编码语言
|
|
30
|
+
* @param {boolean} [options.allowsBackgroundLocationUpdates] - 是否允许后台定位
|
|
31
|
+
* @param {boolean} [options.pausesLocationUpdatesAutomatically] - 是否自动暂停定位
|
|
32
|
+
* @param {boolean} [options.locationCacheEnable] - 是否启用定位缓存
|
|
33
|
+
* @param {number} [options.httpTimeout] - 网络请求超时时间(毫秒)
|
|
34
|
+
* @param {string} [options.protocol] - 定位协议
|
|
25
35
|
*/
|
|
26
36
|
export function configure(options: LocationOptions): void {
|
|
27
37
|
if (options.withReGeocode !== undefined) {
|
|
@@ -80,36 +90,49 @@ export function configure(options: LocationOptions): void {
|
|
|
80
90
|
}
|
|
81
91
|
}
|
|
82
92
|
|
|
93
|
+
|
|
83
94
|
/**
|
|
84
|
-
*
|
|
95
|
+
* 启动高德地图模块,开始连续定位
|
|
96
|
+
* @throws 如果模块未初始化或启动失败时抛出异常
|
|
85
97
|
*/
|
|
86
98
|
export function start(): void {
|
|
87
99
|
ExpoGaodeMapModule.start?.();
|
|
88
100
|
}
|
|
89
101
|
|
|
102
|
+
|
|
90
103
|
/**
|
|
91
|
-
*
|
|
104
|
+
* 停止高德地图相关功能,停止定位
|
|
105
|
+
* @returns {void} 无返回值
|
|
92
106
|
*/
|
|
93
107
|
export function stop(): void {
|
|
94
108
|
ExpoGaodeMapModule.stop?.();
|
|
95
109
|
}
|
|
96
110
|
|
|
111
|
+
|
|
97
112
|
/**
|
|
98
|
-
*
|
|
113
|
+
* 检查高德地图模块是否已启动,是否正在定位
|
|
114
|
+
* @returns {Promise<boolean>} 返回一个Promise,解析为布尔值表示模块是否已启动
|
|
99
115
|
*/
|
|
100
116
|
export async function isStarted(): Promise<boolean> {
|
|
101
117
|
return ExpoGaodeMapModule.isStarted?.() || Promise.resolve(false);
|
|
102
118
|
}
|
|
103
119
|
|
|
120
|
+
|
|
104
121
|
/**
|
|
105
|
-
*
|
|
122
|
+
* 获取设备当前位置信息,单次定位
|
|
123
|
+
* @returns {Promise<Coordinates | ReGeocode>} 返回包含坐标或逆地理编码信息的Promise
|
|
124
|
+
* @throws 如果定位服务不可用或权限被拒绝时抛出错误
|
|
106
125
|
*/
|
|
107
126
|
export async function getCurrentLocation(): Promise<Coordinates | ReGeocode> {
|
|
108
127
|
return ExpoGaodeMapModule.getCurrentLocation?.();
|
|
109
128
|
}
|
|
110
129
|
|
|
130
|
+
|
|
111
131
|
/**
|
|
112
|
-
*
|
|
132
|
+
* 添加位置更新监听器
|
|
133
|
+
* @param {LocationListener} listener - 位置更新时的回调函数
|
|
134
|
+
* @returns {EventSubscription} 事件订阅对象,包含移除监听器的方法
|
|
135
|
+
* @throws 如果底层模块不可用,返回一个空操作的订阅对象
|
|
113
136
|
*/
|
|
114
137
|
export function addLocationListener(listener: LocationListener): EventSubscription {
|
|
115
138
|
return ExpoGaodeMapModule.addListener?.('onLocationUpdate', listener) || {
|
|
@@ -117,8 +140,13 @@ export function addLocationListener(listener: LocationListener): EventSubscripti
|
|
|
117
140
|
} as EventSubscription;
|
|
118
141
|
}
|
|
119
142
|
|
|
143
|
+
|
|
120
144
|
/**
|
|
121
|
-
*
|
|
145
|
+
* 将坐标点转换为指定坐标系下的坐标
|
|
146
|
+
* @param {LatLng} coordinate - 需要转换的原始坐标点
|
|
147
|
+
* @param {CoordinateType} type - 目标坐标系类型
|
|
148
|
+
* @returns {Promise<LatLng>} 转换后的坐标点Promise
|
|
149
|
+
* @throws 如果底层模块不可用,则返回原始坐标
|
|
122
150
|
*/
|
|
123
151
|
export async function coordinateConvert(
|
|
124
152
|
coordinate: LatLng,
|
|
@@ -127,16 +155,22 @@ export async function coordinateConvert(
|
|
|
127
155
|
return ExpoGaodeMapModule.coordinateConvert?.(coordinate, type) || Promise.resolve(coordinate);
|
|
128
156
|
}
|
|
129
157
|
|
|
158
|
+
|
|
130
159
|
/**
|
|
131
|
-
*
|
|
160
|
+
* 开始更新设备方向(罗盘朝向)
|
|
161
|
+
* 调用原生模块方法启动方向更新功能
|
|
162
|
+
* @throws 如果原生模块未实现此方法会抛出异常
|
|
132
163
|
* @platform ios
|
|
133
164
|
*/
|
|
134
165
|
export function startUpdatingHeading(): void {
|
|
135
166
|
ExpoGaodeMapModule.startUpdatingHeading?.();
|
|
136
167
|
}
|
|
137
168
|
|
|
169
|
+
|
|
138
170
|
/**
|
|
139
|
-
*
|
|
171
|
+
* 停止更新设备方向(罗盘朝向)
|
|
172
|
+
* 调用原生模块方法停止监听设备方向变化
|
|
173
|
+
* @throws 如果原生模块未实现此方法会抛出异常
|
|
140
174
|
* @platform ios
|
|
141
175
|
*/
|
|
142
176
|
export function stopUpdatingHeading(): void {
|
|
@@ -144,7 +178,9 @@ export function stopUpdatingHeading(): void {
|
|
|
144
178
|
}
|
|
145
179
|
|
|
146
180
|
/**
|
|
147
|
-
*
|
|
181
|
+
* 设置高德地图的API密钥
|
|
182
|
+
* @param {string} key - 高德地图的API密钥
|
|
183
|
+
* @returns {void}
|
|
148
184
|
*/
|
|
149
185
|
export function setApiKey(key: string): void {
|
|
150
186
|
ExpoGaodeMapModule.setApiKey?.(key);
|
|
@@ -1,13 +1,4 @@
|
|
|
1
|
-
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-15 02:20:56
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-15 02:20:58
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/modules/AMapPermissions.ts
|
|
7
|
-
* @Description :
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
1
|
+
|
|
11
2
|
/*
|
|
12
3
|
* 高德地图权限管理模块
|
|
13
4
|
*/
|
|
@@ -29,7 +20,8 @@ export interface PermissionStatus {
|
|
|
29
20
|
}
|
|
30
21
|
|
|
31
22
|
/**
|
|
32
|
-
*
|
|
23
|
+
* 检查当前应用是否具有位置权限
|
|
24
|
+
* @returns {Promise<PermissionStatus>} 返回一个Promise,解析为位置权限状态
|
|
33
25
|
*/
|
|
34
26
|
export async function checkLocationPermission(): Promise<PermissionStatus> {
|
|
35
27
|
return await ExpoGaodeMapModule.checkLocationPermission();
|
|
@@ -37,6 +29,7 @@ export async function checkLocationPermission(): Promise<PermissionStatus> {
|
|
|
37
29
|
|
|
38
30
|
/**
|
|
39
31
|
* 请求位置权限
|
|
32
|
+
* @returns {Promise<PermissionStatus>} 返回一个Promise,解析为位置权限状态
|
|
40
33
|
*/
|
|
41
34
|
export async function requestLocationPermission(): Promise<PermissionStatus> {
|
|
42
35
|
return await ExpoGaodeMapModule.requestLocationPermission();
|
package/src/modules/AMapSDK.ts
CHANGED
|
@@ -1,13 +1,3 @@
|
|
|
1
|
-
/*
|
|
2
|
-
* @Author : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
3
|
-
* @Date : 2025-11-13 14:41:55
|
|
4
|
-
* @LastEditors : 尚博信_王强 wangqiang03@sunboxsoft.com
|
|
5
|
-
* @LastEditTime : 2025-11-14 16:15:20
|
|
6
|
-
* @FilePath : /expo-gaode-map/src/modules/AMapSDK.ts
|
|
7
|
-
* @Description :
|
|
8
|
-
*
|
|
9
|
-
* Copyright (c) 2025 by 尚博信_王强, All Rights Reserved.
|
|
10
|
-
*/
|
|
11
1
|
/**
|
|
12
2
|
* 高德地图 SDK 模块
|
|
13
3
|
* 基于 Expo Modules 实现
|
|
@@ -16,17 +6,20 @@
|
|
|
16
6
|
import ExpoGaodeMapModule from '../ExpoGaodeMapModule';
|
|
17
7
|
import type { SDKConfig } from '../types';
|
|
18
8
|
|
|
9
|
+
|
|
19
10
|
/**
|
|
20
|
-
* 初始化高德地图
|
|
21
|
-
* @param config SDK
|
|
11
|
+
* 初始化高德地图SDK
|
|
12
|
+
* @param {SDKConfig} config - SDK配置参数
|
|
13
|
+
* @throws 如果初始化失败会抛出异常
|
|
22
14
|
*/
|
|
23
15
|
export function initSDK(config: SDKConfig): void {
|
|
24
16
|
ExpoGaodeMapModule.initSDK?.(config);
|
|
25
17
|
}
|
|
26
18
|
|
|
19
|
+
|
|
27
20
|
/**
|
|
28
|
-
*
|
|
29
|
-
* @returns SDK
|
|
21
|
+
* 获取高德地图SDK的版本号
|
|
22
|
+
* @returns {Promise<string>} 返回一个Promise,解析为高德地图SDK的版本字符串,如果获取失败则返回'unknown'
|
|
30
23
|
*/
|
|
31
24
|
export async function getVersion(): Promise<string> {
|
|
32
25
|
return ExpoGaodeMapModule.getVersion?.() || Promise.resolve('unknown');
|