react-native-baidu-map
react-native-baidu-map copied to clipboard
请问一下如何实现移动地图后,点击按钮回到我的位置的功能?
同问
- 点击触发
import { Geolocation } from 'react-native-baidu-map'
<TouchableOpacity onPress={() => {
Geolocation.getCurrentPosition()
.then(result =>
{
this.setState({
coordinate: result,
newCoordinate: result,
userCoordinate: result,
})
})
}}>
<Text>Refresh</Text>
</TouchableOpacity>
- 更新到地图
<MapView
style={styles.container}
center={this._transform(coordinate)}
zoom={18}
>
{(Platform.OS === 'ios' && coordinate && coordinate.latitude && coordinate.longitude) &&
<Overlay.Marker location={transform(this.state.coordinate)} />
}
{(Platform.OS === 'android' && newCoordinate && newCoordinate.latitude && newCoordinate.longitude) &&
<Overlay.Marker location={this.state.newCoordinate} />
}
</MapView>
为什么我要区分iOS和Android对marker的更新,因为当前的版本不能直接对iOS修改坐标达到修改所在地图的位置,请参考 #319
iOS得到的经纬度放到百度地图上,需要对经纬度转换 (Android不需要转换) gcoord':
import gcoord from 'gcoord'
transform(coordinate)
{
var result = gcoord.transform(
[coordinate.latitude, coordinate.longitude], // 经纬度坐标
gcoord.WGS84, // 当前坐标系
gcoord.BD09, // 目标坐标系
)
return { latitude: result[0], longitude: result[1] }
}