1. 程式人生 > >react-native(android) 使用高德地圖

react-native(android) 使用高德地圖

react-native中使用高德地圖(android 端)

功能實現:

  1. 顯示地圖
  2. 定位
  3. 查詢周邊的 poi

1.安裝依賴

npm install react-native-amap3d

2.構建配置

react-native link react-native-amap3d

3.申請高德地圖 api 的 key

這裡使用到的 key 有兩個:1.android sdk key,用於使用高德 api 元件,和獲取定位。2.webapi key,用於請求附近 poi 列表。

4.配置 key

/android/app/src/main/AndroidManifest.xml裡面application

中新增:

<meta-data
    android:name="com.amap.api.v2.apikey"
    android:value="你的key"
/>

5.使用

6.使用高德地圖-逆地理編碼

通過上述的地圖元件可以獲取定位經緯度座標。根據經緯度直接請求高德 api 的介面即可獲得 poi。請求 api

https://restapi.amap.com/v3/geocode/regeo

引數:

{
    key:'你的key (注意是web服務的key)',
    location:`${longitude},${latitude}`, //經緯度,用逗號隔開
    extensions:'all' //新增該引數才可以獲得poi
}