react调用百度api获取地理位置和导航

第一步
先引入百度api

 

第二部
挂载到组件

componentDidMount() {
        const _this=this;
        var BMap = window.BMap;
        var geoc = new BMap.Geocoder();
        var geolocation = new BMap.Geolocation();
        geolocation.getCurrentPosition(function (r) {
            geoc.getLocation(r.point, function (rs) {
                console.log(rs)   //具体信息可以打印出来看一下,根据需求取值     经纬度,城市,街道等等
                var addComp = rs.addressComponents;
                let cityName = addComp.city;
                _this.setState({
                    cityName:cityName,  //城市名
                })
            });
        });
    }  

导航
点击跳转到百度页面
window.location.href = “http://api.map.baidu.com/marker?location=” + lat + “,” + lng + “&title=” + titleName + “&content=” +content+ “&output=html”
lat:纬度坐标 //用户起始位置
lng:经度坐标 //用户起始位置
titleName:定位位置显示的标题,一般为定位地点的名称 //用户目标位置
content:内容介绍,可写地点地址或者简介等。 //用户目标位置

你可能感兴趣的:(定位,百度apI,React)