React Native 接入高德地图以及定位能力（一）

开始

接入第三方能力的常规操作，到高德开放平台注册账号，创建应用，为对应的平台（Android/IOS/Web）创建不同的key

image.png

接入地图SDK

文档地址react-native-amap3d、react-native-amap-geolocation

地图组件东西比较多，暂时用不到，这里主要讲定位模块。接入方式很简单就不再阐述了；

image.png

图中信息是定位能拿到的信息，但也存在一些问题需要注意：

问题一：

免费版定位有使用限制

image.png
问题###### 二：
一般我们需要的主要信息是经纬度以及地址信息，
在实际测试过程发现Android是能拿到经纬度（地理编码）和地址信息（逆地理编码），IOS获取不到地址信息，所以需要对无法获取到详细地址的情况进行处理；这时候就需要web服务Api类型key，逆地理编码文档,补刀获取详细地址
image.png

export const getAddress = (lat, lng, callback) => {
    fetch(`https://restapi.amap.com/v3/geocode/regeo?key=${web key}&location=${lng},${lat}`, {
        method: 'GET',
    })
        .then(response => response.json())
        .then(result => {
            console.log('result', result);
        })
        .catch(error => {
            console.log('error', error);
        });
};

同时在定位位置不对时，我们需要通过react-native-amap3d手动选点时只能拿到经纬度，是不能获取到地址信息的，这时也需要通过上面的web api逆地理编码来拿到地址信息；这样我们就能够实现个人定位信息的获取；

在下篇博客将会将到如何选点，如何画点，如何唤起高德导航，以及该地图组件在选点、画点遇到的坑