expo-gaode-map 2.0.0-alpha.6 → 2.0.0
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/DEPLOY_DOCS.md +209 -0
- package/PUBLISHING.md +173 -155
- package/README.en.md +1 -25
- package/README.md +26 -456
- package/RELEASE_CHECKLIST.md +146 -0
- package/RELEASE_v2.0.0.md +59 -0
- package/app.plugin.js +11 -0
- package/ios/modules/LocationManager.swift +4 -3
- package/package.json +8 -5
- package/plugin/README.md +52 -0
- package/plugin/build/withGaodeMap.d.ts +20 -0
- package/plugin/build/withGaodeMap.js +147 -0
- package/plugin/tsconfig.tsbuildinfo +1 -0
- package/docs/API.en.md +0 -408
- package/docs/API.md +0 -494
- package/docs/ARCHITECTURE.en.md +0 -423
- package/docs/ARCHITECTURE.md +0 -423
- package/docs/EXAMPLES.en.md +0 -651
- package/docs/EXAMPLES.md +0 -922
- package/docs/INITIALIZATION.en.md +0 -346
- package/docs/INITIALIZATION.md +0 -335
- package/docs/MIGRATION.md +0 -423
- package/docs/RELEASE_GUIDE.md +0 -178
|
@@ -1,346 +0,0 @@
|
|
|
1
|
-
# Initialization Guide
|
|
2
|
-
|
|
3
|
-
English | [简体中文](./INITIALIZATION.md)
|
|
4
|
-
|
|
5
|
-
This document explains how to properly initialize and configure expo-gaode-map.
|
|
6
|
-
|
|
7
|
-
## Table of Contents
|
|
8
|
-
|
|
9
|
-
- [Basic Initialization Process](#basic-initialization-process)
|
|
10
|
-
- [Permission Management](#permission-management)
|
|
11
|
-
- [Complete Example](#complete-example)
|
|
12
|
-
- [Common Issues](#common-issues)
|
|
13
|
-
|
|
14
|
-
## Basic Initialization Process
|
|
15
|
-
|
|
16
|
-
### 1. SDK Initialization
|
|
17
|
-
|
|
18
|
-
Initialize the SDK when the app starts (usually in the App component's useEffect):
|
|
19
|
-
|
|
20
|
-
```tsx
|
|
21
|
-
import { initSDK } from 'expo-gaode-map';
|
|
22
|
-
|
|
23
|
-
useEffect(() => {
|
|
24
|
-
initSDK({
|
|
25
|
-
androidKey: 'your-android-api-key',
|
|
26
|
-
iosKey: 'your-ios-api-key',
|
|
27
|
-
});
|
|
28
|
-
}, []);
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
### 2. Permission Check and Request
|
|
32
|
-
|
|
33
|
-
Before using location features, you must check and request permissions:
|
|
34
|
-
|
|
35
|
-
```tsx
|
|
36
|
-
import {
|
|
37
|
-
checkLocationPermission,
|
|
38
|
-
requestLocationPermission
|
|
39
|
-
} from 'expo-gaode-map';
|
|
40
|
-
|
|
41
|
-
// Check permission status
|
|
42
|
-
const status = await checkLocationPermission();
|
|
43
|
-
console.log('Permission status:', status);
|
|
44
|
-
// { granted: boolean, canAskAgain: boolean }
|
|
45
|
-
|
|
46
|
-
// Request permission
|
|
47
|
-
if (!status.granted) {
|
|
48
|
-
const result = await requestLocationPermission();
|
|
49
|
-
if (result.granted) {
|
|
50
|
-
console.log('Permission granted');
|
|
51
|
-
} else {
|
|
52
|
-
console.log('Permission denied');
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
```
|
|
56
|
-
|
|
57
|
-
### 3. Get Location
|
|
58
|
-
|
|
59
|
-
After permission is granted, you can get the current location:
|
|
60
|
-
|
|
61
|
-
```tsx
|
|
62
|
-
import { getCurrentLocation } from 'expo-gaode-map';
|
|
63
|
-
|
|
64
|
-
try {
|
|
65
|
-
const location = await getCurrentLocation();
|
|
66
|
-
console.log('Current location:', location);
|
|
67
|
-
} catch (error) {
|
|
68
|
-
console.error('Get location failed:', error);
|
|
69
|
-
}
|
|
70
|
-
```
|
|
71
|
-
|
|
72
|
-
## Permission Management
|
|
73
|
-
|
|
74
|
-
### Permission APIs
|
|
75
|
-
|
|
76
|
-
| API | Description | Return Value |
|
|
77
|
-
|-----|-------------|--------------|
|
|
78
|
-
| `checkLocationPermission()` | Check location permission status | `Promise<PermissionStatus>` |
|
|
79
|
-
| `requestLocationPermission()` | Request location permission | `Promise<PermissionStatus>` |
|
|
80
|
-
|
|
81
|
-
### PermissionStatus Type
|
|
82
|
-
|
|
83
|
-
```typescript
|
|
84
|
-
interface PermissionStatus {
|
|
85
|
-
granted: boolean; // Whether permission is granted
|
|
86
|
-
canAskAgain: boolean; // Whether can request again
|
|
87
|
-
}
|
|
88
|
-
```
|
|
89
|
-
|
|
90
|
-
### Permission Status Explanation
|
|
91
|
-
|
|
92
|
-
- **granted: true** - User granted permission, can use location features
|
|
93
|
-
- **granted: false, canAskAgain: true** - User denied permission, but can request again
|
|
94
|
-
- **granted: false, canAskAgain: false** - User permanently denied permission, need to guide user to settings
|
|
95
|
-
|
|
96
|
-
## Complete Example
|
|
97
|
-
|
|
98
|
-
### Recommended Initialization Process
|
|
99
|
-
|
|
100
|
-
```tsx
|
|
101
|
-
import { useEffect, useState } from 'react';
|
|
102
|
-
import { Alert, Platform, Linking } from 'react-native';
|
|
103
|
-
import {
|
|
104
|
-
MapView,
|
|
105
|
-
initSDK,
|
|
106
|
-
checkLocationPermission,
|
|
107
|
-
requestLocationPermission,
|
|
108
|
-
getCurrentLocation,
|
|
109
|
-
type LatLng,
|
|
110
|
-
} from 'expo-gaode-map';
|
|
111
|
-
|
|
112
|
-
export default function App() {
|
|
113
|
-
const [initialPosition, setInitialPosition] = useState<{
|
|
114
|
-
target: LatLng;
|
|
115
|
-
zoom: number;
|
|
116
|
-
} | null>(null);
|
|
117
|
-
|
|
118
|
-
useEffect(() => {
|
|
119
|
-
const initializeApp = async () => {
|
|
120
|
-
try {
|
|
121
|
-
// 1. Initialize SDK
|
|
122
|
-
console.log('Initializing AMap SDK...');
|
|
123
|
-
initSDK({
|
|
124
|
-
androidKey: 'your-android-api-key',
|
|
125
|
-
iosKey: 'your-ios-api-key',
|
|
126
|
-
});
|
|
127
|
-
|
|
128
|
-
// 2. Check permission
|
|
129
|
-
const status = await checkLocationPermission();
|
|
130
|
-
|
|
131
|
-
// 3. Request permission if needed
|
|
132
|
-
if (!status.granted) {
|
|
133
|
-
const result = await requestLocationPermission();
|
|
134
|
-
|
|
135
|
-
if (!result.granted) {
|
|
136
|
-
// Permission denied, use default location
|
|
137
|
-
console.log('Location permission denied, using default location');
|
|
138
|
-
setInitialPosition({
|
|
139
|
-
target: { latitude: 39.90923, longitude: 116.397428 },
|
|
140
|
-
zoom: 10
|
|
141
|
-
});
|
|
142
|
-
|
|
143
|
-
// Guide user to settings if cannot ask again
|
|
144
|
-
if (!result.canAskAgain) {
|
|
145
|
-
Alert.alert(
|
|
146
|
-
'Location Permission Required',
|
|
147
|
-
'Please enable location permission in settings',
|
|
148
|
-
[
|
|
149
|
-
{ text: 'Cancel', style: 'cancel' },
|
|
150
|
-
{ text: 'Settings', onPress: () => {
|
|
151
|
-
if (Platform.OS === 'ios') {
|
|
152
|
-
Linking.openURL('app-settings:');
|
|
153
|
-
} else {
|
|
154
|
-
Linking.openSettings();
|
|
155
|
-
}
|
|
156
|
-
}}
|
|
157
|
-
]
|
|
158
|
-
);
|
|
159
|
-
}
|
|
160
|
-
return;
|
|
161
|
-
}
|
|
162
|
-
}
|
|
163
|
-
|
|
164
|
-
// 4. Get current location
|
|
165
|
-
const location = await getCurrentLocation();
|
|
166
|
-
console.log('Current location:', location);
|
|
167
|
-
|
|
168
|
-
// 5. Set map initial position
|
|
169
|
-
setInitialPosition({
|
|
170
|
-
target: {
|
|
171
|
-
latitude: location.latitude,
|
|
172
|
-
longitude: location.longitude
|
|
173
|
-
},
|
|
174
|
-
zoom: 15
|
|
175
|
-
});
|
|
176
|
-
|
|
177
|
-
} catch (error) {
|
|
178
|
-
console.error('Initialization failed:', error);
|
|
179
|
-
// Use default location
|
|
180
|
-
setInitialPosition({
|
|
181
|
-
target: { latitude: 39.90923, longitude: 116.397428 },
|
|
182
|
-
zoom: 10
|
|
183
|
-
});
|
|
184
|
-
}
|
|
185
|
-
};
|
|
186
|
-
|
|
187
|
-
initializeApp();
|
|
188
|
-
}, []);
|
|
189
|
-
|
|
190
|
-
// Wait for initialization
|
|
191
|
-
if (!initialPosition) {
|
|
192
|
-
return <LoadingScreen />;
|
|
193
|
-
}
|
|
194
|
-
|
|
195
|
-
return (
|
|
196
|
-
<MapView
|
|
197
|
-
style={{ flex: 1 }}
|
|
198
|
-
initialCameraPosition={initialPosition}
|
|
199
|
-
myLocationEnabled={true}
|
|
200
|
-
onLoad={() => console.log('Map loaded')}
|
|
201
|
-
/>
|
|
202
|
-
);
|
|
203
|
-
}
|
|
204
|
-
```
|
|
205
|
-
|
|
206
|
-
### Key Points
|
|
207
|
-
|
|
208
|
-
1. **Initialization Order**:
|
|
209
|
-
```
|
|
210
|
-
initSDK → checkPermission → requestPermission → getCurrentLocation → Render Map
|
|
211
|
-
```
|
|
212
|
-
|
|
213
|
-
2. **Permission Handling**:
|
|
214
|
-
- ✅ Always check permission status first
|
|
215
|
-
- ✅ Only request permission when needed
|
|
216
|
-
- ✅ Handle permission denial cases
|
|
217
|
-
- ✅ Provide default location as fallback
|
|
218
|
-
|
|
219
|
-
3. **Map Rendering**:
|
|
220
|
-
- ✅ **Important**: Wait for `initialPosition` to be set before rendering MapView
|
|
221
|
-
- ✅ Use `initialCameraPosition` to set initial position
|
|
222
|
-
- ⚠️ **iOS Note**: If map is rendered before getting location, it will show default location (Beijing) first then jump, causing flicker
|
|
223
|
-
- ✅ Both Android and iOS will directly position to specified location when map is displayed
|
|
224
|
-
|
|
225
|
-
## Common Issues
|
|
226
|
-
|
|
227
|
-
### Q: How to handle user denying permission?
|
|
228
|
-
|
|
229
|
-
**A:** Provide default location and guide user:
|
|
230
|
-
|
|
231
|
-
```tsx
|
|
232
|
-
if (!result.granted) {
|
|
233
|
-
// Use default location
|
|
234
|
-
setInitialPosition({
|
|
235
|
-
target: { latitude: 39.90923, longitude: 116.397428 },
|
|
236
|
-
zoom: 10
|
|
237
|
-
});
|
|
238
|
-
|
|
239
|
-
// Guide to settings if cannot ask again
|
|
240
|
-
if (!result.canAskAgain) {
|
|
241
|
-
Alert.alert(
|
|
242
|
-
'Location Permission Required',
|
|
243
|
-
'Please enable location permission in settings',
|
|
244
|
-
[
|
|
245
|
-
{ text: 'Cancel' },
|
|
246
|
-
{ text: 'Settings', onPress: () => Linking.openSettings() }
|
|
247
|
-
]
|
|
248
|
-
);
|
|
249
|
-
}
|
|
250
|
-
}
|
|
251
|
-
```
|
|
252
|
-
|
|
253
|
-
### Q: Can I update location after map is loaded?
|
|
254
|
-
|
|
255
|
-
**A:** Yes, use the `moveCamera` method:
|
|
256
|
-
|
|
257
|
-
```tsx
|
|
258
|
-
const mapRef = useRef<MapViewRef>(null);
|
|
259
|
-
|
|
260
|
-
// Update map center
|
|
261
|
-
await mapRef.current?.moveCamera({
|
|
262
|
-
target: { latitude: 40.0, longitude: 116.5 },
|
|
263
|
-
zoom: 15,
|
|
264
|
-
}, 1000); // 1 second animation
|
|
265
|
-
```
|
|
266
|
-
|
|
267
|
-
### Q: How to configure location parameters?
|
|
268
|
-
|
|
269
|
-
**A:** Use the `configure` function, **must be called after `initSDK`**:
|
|
270
|
-
|
|
271
|
-
```tsx
|
|
272
|
-
import { initSDK, configure } from 'expo-gaode-map';
|
|
273
|
-
|
|
274
|
-
// 1. Initialize SDK first
|
|
275
|
-
initSDK({
|
|
276
|
-
androidKey: 'your-android-api-key',
|
|
277
|
-
iosKey: 'your-ios-api-key',
|
|
278
|
-
});
|
|
279
|
-
|
|
280
|
-
// 2. Then configure location parameters
|
|
281
|
-
configure({
|
|
282
|
-
withReGeocode: true, // Return address info
|
|
283
|
-
mode: 0, // High accuracy mode
|
|
284
|
-
interval: 2000, // Update every 2 seconds
|
|
285
|
-
});
|
|
286
|
-
```
|
|
287
|
-
|
|
288
|
-
> ⚠️ **Important**: `configure` must be called after `initSDK`, otherwise configuration may not take effect.
|
|
289
|
-
|
|
290
|
-
### Q: Are there differences between Android and iOS initialization?
|
|
291
|
-
|
|
292
|
-
**A:** The initialization process is the same, but there are differences:
|
|
293
|
-
|
|
294
|
-
**Android:**
|
|
295
|
-
- Need to configure permissions in `AndroidManifest.xml`
|
|
296
|
-
- Support more location configuration options
|
|
297
|
-
|
|
298
|
-
**iOS:**
|
|
299
|
-
- Need to configure permission descriptions in `Info.plist`
|
|
300
|
-
- Support background location and heading updates
|
|
301
|
-
|
|
302
|
-
For detailed configuration, see [AMap Official Documentation](https://lbs.amap.com/).
|
|
303
|
-
|
|
304
|
-
## Best Practices
|
|
305
|
-
|
|
306
|
-
1. **Always Handle Permissions**:
|
|
307
|
-
```tsx
|
|
308
|
-
// ✅ Good practice
|
|
309
|
-
const status = await checkLocationPermission();
|
|
310
|
-
if (!status.granted) {
|
|
311
|
-
await requestLocationPermission();
|
|
312
|
-
}
|
|
313
|
-
|
|
314
|
-
// ❌ Bad practice
|
|
315
|
-
await getCurrentLocation(); // May fail due to no permission
|
|
316
|
-
```
|
|
317
|
-
|
|
318
|
-
2. **Provide Loading State**:
|
|
319
|
-
```tsx
|
|
320
|
-
if (!initialPosition) {
|
|
321
|
-
return <LoadingScreen />;
|
|
322
|
-
}
|
|
323
|
-
```
|
|
324
|
-
|
|
325
|
-
3. **Error Handling**:
|
|
326
|
-
```tsx
|
|
327
|
-
try {
|
|
328
|
-
const location = await getCurrentLocation();
|
|
329
|
-
} catch (error) {
|
|
330
|
-
console.error('Get location failed:', error);
|
|
331
|
-
// Use default location
|
|
332
|
-
}
|
|
333
|
-
```
|
|
334
|
-
|
|
335
|
-
4. **Avoid Repeated Initialization**:
|
|
336
|
-
```tsx
|
|
337
|
-
useEffect(() => {
|
|
338
|
-
initSDK({ ... });
|
|
339
|
-
}, []); // Empty dependency array, initialize only once
|
|
340
|
-
```
|
|
341
|
-
|
|
342
|
-
## Related Documentation
|
|
343
|
-
|
|
344
|
-
- [API Documentation](./API.en.md) - Complete API reference
|
|
345
|
-
- [Usage Examples](./EXAMPLES.en.md) - Detailed code examples
|
|
346
|
-
- [README](../README.md) - Quick start guide
|
package/docs/INITIALIZATION.md
DELETED
|
@@ -1,335 +0,0 @@
|
|
|
1
|
-
# 初始化指南
|
|
2
|
-
|
|
3
|
-
[English](./INITIALIZATION.en.md) | 简体中文
|
|
4
|
-
|
|
5
|
-
本文档详细说明如何正确初始化和配置 expo-gaode-map。
|
|
6
|
-
|
|
7
|
-
## 目录
|
|
8
|
-
|
|
9
|
-
- [基本初始化流程](#基本初始化流程)
|
|
10
|
-
- [权限管理](#权限管理)
|
|
11
|
-
- [完整示例](#完整示例)
|
|
12
|
-
- [常见问题](#常见问题)
|
|
13
|
-
|
|
14
|
-
## 基本初始化流程
|
|
15
|
-
|
|
16
|
-
### 1. SDK 初始化
|
|
17
|
-
|
|
18
|
-
在应用启动时初始化 SDK(通常在 App 组件的 useEffect 中):
|
|
19
|
-
|
|
20
|
-
```tsx
|
|
21
|
-
import { ExpoGaodeMapModule } from 'expo-gaode-map';
|
|
22
|
-
|
|
23
|
-
useEffect(() => {
|
|
24
|
-
ExpoGaodeMapModule.initSDK({
|
|
25
|
-
androidKey: 'your-android-api-key',
|
|
26
|
-
iosKey: 'your-ios-api-key',
|
|
27
|
-
});
|
|
28
|
-
}, []);
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
### 2. 权限检查和请求
|
|
32
|
-
|
|
33
|
-
在使用定位功能前,必须先检查和请求权限:
|
|
34
|
-
|
|
35
|
-
```tsx
|
|
36
|
-
import { ExpoGaodeMapModule } from 'expo-gaode-map';
|
|
37
|
-
|
|
38
|
-
// 检查权限状态
|
|
39
|
-
const status = await ExpoGaodeMapModule.checkLocationPermission();
|
|
40
|
-
console.log('权限状态:', status);
|
|
41
|
-
// { granted: boolean, status: string }
|
|
42
|
-
|
|
43
|
-
// 请求权限
|
|
44
|
-
if (!status.granted) {
|
|
45
|
-
const result = await ExpoGaodeMapModule.requestLocationPermission();
|
|
46
|
-
if (result.granted) {
|
|
47
|
-
console.log('权限已授予');
|
|
48
|
-
} else {
|
|
49
|
-
console.log('权限被拒绝');
|
|
50
|
-
}
|
|
51
|
-
}
|
|
52
|
-
```
|
|
53
|
-
|
|
54
|
-
### 3. 获取位置
|
|
55
|
-
|
|
56
|
-
权限授予后,可以获取当前位置:
|
|
57
|
-
|
|
58
|
-
```tsx
|
|
59
|
-
import { ExpoGaodeMapModule } from 'expo-gaode-map';
|
|
60
|
-
|
|
61
|
-
try {
|
|
62
|
-
const location = await ExpoGaodeMapModule.getCurrentLocation();
|
|
63
|
-
console.log('当前位置:', location);
|
|
64
|
-
} catch (error) {
|
|
65
|
-
console.error('获取位置失败:', error);
|
|
66
|
-
}
|
|
67
|
-
```
|
|
68
|
-
|
|
69
|
-
## 权限管理
|
|
70
|
-
|
|
71
|
-
### 权限 API
|
|
72
|
-
|
|
73
|
-
| API | 说明 | 返回值 |
|
|
74
|
-
|-----|------|--------|
|
|
75
|
-
| `ExpoGaodeMapModule.checkLocationPermission()` | 检查定位权限状态 | `Promise<PermissionStatus>` |
|
|
76
|
-
| `ExpoGaodeMapModule.requestLocationPermission()` | 请求定位权限 | `Promise<PermissionStatus>` |
|
|
77
|
-
|
|
78
|
-
### PermissionStatus 类型
|
|
79
|
-
|
|
80
|
-
```typescript
|
|
81
|
-
interface PermissionStatus {
|
|
82
|
-
granted: boolean; // 是否已授予权限
|
|
83
|
-
status: string; // 权限状态字符串
|
|
84
|
-
}
|
|
85
|
-
```
|
|
86
|
-
|
|
87
|
-
### 权限状态说明
|
|
88
|
-
|
|
89
|
-
- **granted: true** - 用户已授予权限,可以使用定位功能
|
|
90
|
-
- **granted: false** - 用户未授予权限
|
|
91
|
-
- **status** - 权限状态字符串(notDetermined, denied, authorizedWhenInUse, authorizedAlways 等)
|
|
92
|
-
|
|
93
|
-
## 完整示例
|
|
94
|
-
|
|
95
|
-
### 推荐的初始化流程
|
|
96
|
-
|
|
97
|
-
```tsx
|
|
98
|
-
import { useEffect, useState } from 'react';
|
|
99
|
-
import { Alert, Platform, Linking } from 'react-native';
|
|
100
|
-
import {
|
|
101
|
-
MapView,
|
|
102
|
-
ExpoGaodeMapModule,
|
|
103
|
-
type LatLng,
|
|
104
|
-
} from 'expo-gaode-map';
|
|
105
|
-
|
|
106
|
-
export default function App() {
|
|
107
|
-
const [initialPosition, setInitialPosition] = useState<{
|
|
108
|
-
target: LatLng;
|
|
109
|
-
zoom: number;
|
|
110
|
-
} | null>(null);
|
|
111
|
-
|
|
112
|
-
useEffect(() => {
|
|
113
|
-
const initializeApp = async () => {
|
|
114
|
-
try {
|
|
115
|
-
// 1. 初始化 SDK
|
|
116
|
-
console.log('正在初始化高德地图 SDK...');
|
|
117
|
-
ExpoGaodeMapModule.initSDK({
|
|
118
|
-
androidKey: 'your-android-api-key',
|
|
119
|
-
iosKey: 'your-ios-api-key',
|
|
120
|
-
});
|
|
121
|
-
|
|
122
|
-
// 2. 检查权限
|
|
123
|
-
const status = await ExpoGaodeMapModule.checkLocationPermission();
|
|
124
|
-
|
|
125
|
-
// 3. 如果没有权限,请求权限
|
|
126
|
-
if (!status.granted) {
|
|
127
|
-
const result = await ExpoGaodeMapModule.requestLocationPermission();
|
|
128
|
-
|
|
129
|
-
if (!result.granted) {
|
|
130
|
-
// 权限被拒绝,使用默认位置
|
|
131
|
-
console.log('定位权限被拒绝,使用默认位置');
|
|
132
|
-
setInitialPosition({
|
|
133
|
-
target: { latitude: 39.90923, longitude: 116.397428 },
|
|
134
|
-
zoom: 10
|
|
135
|
-
});
|
|
136
|
-
|
|
137
|
-
// 引导用户到设置
|
|
138
|
-
Alert.alert(
|
|
139
|
-
'需要定位权限',
|
|
140
|
-
'请在设置中开启定位权限以使用完整功能',
|
|
141
|
-
[
|
|
142
|
-
{ text: '取消', style: 'cancel' },
|
|
143
|
-
{ text: '去设置', onPress: () => {
|
|
144
|
-
// 打开应用设置
|
|
145
|
-
if (Platform.OS === 'ios') {
|
|
146
|
-
Linking.openURL('app-settings:');
|
|
147
|
-
} else {
|
|
148
|
-
Linking.openSettings();
|
|
149
|
-
}
|
|
150
|
-
}}
|
|
151
|
-
]
|
|
152
|
-
);
|
|
153
|
-
return;
|
|
154
|
-
}
|
|
155
|
-
}
|
|
156
|
-
|
|
157
|
-
// 4. 获取当前位置
|
|
158
|
-
const location = await ExpoGaodeMapModule.getCurrentLocation();
|
|
159
|
-
console.log('当前位置:', location);
|
|
160
|
-
|
|
161
|
-
// 5. 设置地图初始位置
|
|
162
|
-
setInitialPosition({
|
|
163
|
-
target: {
|
|
164
|
-
latitude: location.latitude,
|
|
165
|
-
longitude: location.longitude
|
|
166
|
-
},
|
|
167
|
-
zoom: 15
|
|
168
|
-
});
|
|
169
|
-
|
|
170
|
-
} catch (error) {
|
|
171
|
-
console.error('初始化失败:', error);
|
|
172
|
-
// 使用默认位置
|
|
173
|
-
setInitialPosition({
|
|
174
|
-
target: { latitude: 39.90923, longitude: 116.397428 },
|
|
175
|
-
zoom: 10
|
|
176
|
-
});
|
|
177
|
-
}
|
|
178
|
-
};
|
|
179
|
-
|
|
180
|
-
initializeApp();
|
|
181
|
-
}, []);
|
|
182
|
-
|
|
183
|
-
// 等待初始化完成
|
|
184
|
-
if (!initialPosition) {
|
|
185
|
-
return <LoadingScreen />;
|
|
186
|
-
}
|
|
187
|
-
|
|
188
|
-
return (
|
|
189
|
-
<MapView
|
|
190
|
-
style={{ flex: 1 }}
|
|
191
|
-
initialCameraPosition={initialPosition}
|
|
192
|
-
myLocationEnabled={true}
|
|
193
|
-
onLoad={() => console.log('地图加载完成')}
|
|
194
|
-
/>
|
|
195
|
-
);
|
|
196
|
-
}
|
|
197
|
-
```
|
|
198
|
-
|
|
199
|
-
### 关键要点
|
|
200
|
-
|
|
201
|
-
1. **初始化顺序**:
|
|
202
|
-
```
|
|
203
|
-
ExpoGaodeMapModule.initSDK → checkLocationPermission → requestLocationPermission → getCurrentLocation → 渲染地图
|
|
204
|
-
```
|
|
205
|
-
|
|
206
|
-
2. **权限处理**:
|
|
207
|
-
- ✅ 总是先检查权限状态
|
|
208
|
-
- ✅ 只在需要时请求权限
|
|
209
|
-
- ✅ 处理权限被拒绝的情况
|
|
210
|
-
- ✅ 提供默认位置作为后备方案
|
|
211
|
-
|
|
212
|
-
3. **地图渲染**:
|
|
213
|
-
- ✅ **重要**: 等待 `initialPosition` 设置后再渲染 MapView
|
|
214
|
-
- ✅ 使用 `initialCameraPosition` 设置初始位置
|
|
215
|
-
- ⚠️ **iOS 注意**: 如果在获取位置前就渲染地图,会先显示默认位置(北京)再跳转,造成闪烁
|
|
216
|
-
- ✅ Android 和 iOS 都会在地图显示时直接定位到指定位置
|
|
217
|
-
|
|
218
|
-
## 常见问题
|
|
219
|
-
|
|
220
|
-
### Q: 如何处理用户拒绝权限的情况?
|
|
221
|
-
|
|
222
|
-
**A:** 提供默认位置并引导用户:
|
|
223
|
-
|
|
224
|
-
```tsx
|
|
225
|
-
if (!result.granted) {
|
|
226
|
-
// 使用默认位置
|
|
227
|
-
setInitialPosition({
|
|
228
|
-
target: { latitude: 39.90923, longitude: 116.397428 },
|
|
229
|
-
zoom: 10
|
|
230
|
-
});
|
|
231
|
-
|
|
232
|
-
// 引导到设置
|
|
233
|
-
Alert.alert(
|
|
234
|
-
'需要定位权限',
|
|
235
|
-
'请在设置中开启定位权限',
|
|
236
|
-
[
|
|
237
|
-
{ text: '取消' },
|
|
238
|
-
{ text: '去设置', onPress: () => Linking.openSettings() }
|
|
239
|
-
]
|
|
240
|
-
);
|
|
241
|
-
}
|
|
242
|
-
```
|
|
243
|
-
|
|
244
|
-
### Q: 可以在地图加载后更新位置吗?
|
|
245
|
-
|
|
246
|
-
**A:** 可以,使用 `moveCamera` 方法:
|
|
247
|
-
|
|
248
|
-
```tsx
|
|
249
|
-
const mapRef = useRef<MapViewRef>(null);
|
|
250
|
-
|
|
251
|
-
// 更新地图中心
|
|
252
|
-
await mapRef.current?.moveCamera({
|
|
253
|
-
target: { latitude: 40.0, longitude: 116.5 },
|
|
254
|
-
zoom: 15,
|
|
255
|
-
}, 1000); // 1秒动画
|
|
256
|
-
```
|
|
257
|
-
|
|
258
|
-
### Q: 如何配置定位参数?
|
|
259
|
-
|
|
260
|
-
**A:** 使用配置方法,**必须在 `initSDK` 之后调用**:
|
|
261
|
-
|
|
262
|
-
```tsx
|
|
263
|
-
import { ExpoGaodeMapModule } from 'expo-gaode-map';
|
|
264
|
-
|
|
265
|
-
// 1. 先初始化 SDK
|
|
266
|
-
ExpoGaodeMapModule.initSDK({
|
|
267
|
-
androidKey: 'your-android-api-key',
|
|
268
|
-
iosKey: 'your-ios-api-key',
|
|
269
|
-
});
|
|
270
|
-
|
|
271
|
-
// 2. 再配置定位参数
|
|
272
|
-
ExpoGaodeMapModule.setLocatingWithReGeocode(true); // 返回地址信息
|
|
273
|
-
ExpoGaodeMapModule.setLocationMode(0); // 高精度模式
|
|
274
|
-
ExpoGaodeMapModule.setInterval(2000); // 2秒更新一次
|
|
275
|
-
```
|
|
276
|
-
|
|
277
|
-
> ⚠️ **重要**: 配置方法必须在 `initSDK` 之后调用,否则配置可能不生效。
|
|
278
|
-
|
|
279
|
-
### Q: Android 和 iOS 的初始化有区别吗?
|
|
280
|
-
|
|
281
|
-
**A:** 初始化流程相同,但有以下差异:
|
|
282
|
-
|
|
283
|
-
**Android:**
|
|
284
|
-
- 需要在 `AndroidManifest.xml` 中配置权限
|
|
285
|
-
- 支持更多定位配置选项
|
|
286
|
-
|
|
287
|
-
**iOS:**
|
|
288
|
-
- 需要在 `Info.plist` 中配置权限描述
|
|
289
|
-
- 支持后台定位和方向更新
|
|
290
|
-
|
|
291
|
-
详细配置请参考 [高德地图官方文档](https://lbs.amap.com/)。
|
|
292
|
-
|
|
293
|
-
## 最佳实践
|
|
294
|
-
|
|
295
|
-
1. **总是处理权限**:
|
|
296
|
-
```tsx
|
|
297
|
-
// ✅ 好的做法
|
|
298
|
-
const status = await ExpoGaodeMapModule.checkLocationPermission();
|
|
299
|
-
if (!status.granted) {
|
|
300
|
-
await ExpoGaodeMapModule.requestLocationPermission();
|
|
301
|
-
}
|
|
302
|
-
|
|
303
|
-
// ❌ 不好的做法
|
|
304
|
-
await ExpoGaodeMapModule.getCurrentLocation(); // 可能因为没有权限而失败
|
|
305
|
-
```
|
|
306
|
-
|
|
307
|
-
2. **提供加载状态**:
|
|
308
|
-
```tsx
|
|
309
|
-
if (!initialPosition) {
|
|
310
|
-
return <LoadingScreen />;
|
|
311
|
-
}
|
|
312
|
-
```
|
|
313
|
-
|
|
314
|
-
3. **错误处理**:
|
|
315
|
-
```tsx
|
|
316
|
-
try {
|
|
317
|
-
const location = await ExpoGaodeMapModule.getCurrentLocation();
|
|
318
|
-
} catch (error) {
|
|
319
|
-
console.error('获取位置失败:', error);
|
|
320
|
-
// 使用默认位置
|
|
321
|
-
}
|
|
322
|
-
```
|
|
323
|
-
|
|
324
|
-
4. **避免重复初始化**:
|
|
325
|
-
```tsx
|
|
326
|
-
useEffect(() => {
|
|
327
|
-
ExpoGaodeMapModule.initSDK({ ... });
|
|
328
|
-
}, []); // 空依赖数组,只初始化一次
|
|
329
|
-
```
|
|
330
|
-
|
|
331
|
-
## 相关文档
|
|
332
|
-
|
|
333
|
-
- [API 文档](./API.md) - 完整的 API 参考
|
|
334
|
-
- [使用示例](./EXAMPLES.md) - 详细的代码示例
|
|
335
|
-
- [README](../README.md) - 快速开始指南
|