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.
@@ -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
@@ -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) - 快速开始指南