react 高德地图

React Map 地址:
https://elemefe.github.io/react-amap/articles/high

安装
npm install react-amap --save
npm instal react-amap-plugin-geolocation --save

js定义
import { Map } from 'react-amap'
import Geolocation from 'react-amap-plugin-geolocation'

const pluginProps = {
enableHighAccuracy: true,//是否使用高精度定位,默认:true
timeout: 100, //超过10秒后停止定位,默认:无穷大
maximumAge: 0, //定位结果缓存0毫秒,默认:0
convert: true, //自动偏移坐标,偏移后的坐标为高德坐标,默认:true
showButton: true, //显示定位按钮,默认:true
buttonPosition: 'RB', //定位按钮停靠位置,默认:'LB',左下角
showMarker: true, //定位成功后在定位到的位置显示点标记,默认:true
showCircle: true, //定位成功后用圆圈表示定位精度范围,默认:true
panToLocation: true, //定位成功后将定位到的位置作为地图中心点,默认:true
zoomToAccuracy:true, //定位成功后调整地图视野范围使定位位置及精度范围视野内可见,默认:f
extensions:'all'
}



ref={(locat)=>this.mapLocation = locat}
{...pluginProps} />


注释:Map必须外加一个div(宽高是必须给的),否则无法显示。

获取地址详细信息
onClick={()=>{
this.mapLocation.geolocation.getCurrentPosition((status,getData)=>{
this.setState({
flag:true,
AddressList:getData['pois']
});
})

你可能感兴趣的:(react 高德地图)