React Native Mapbox GL 给 UserLocation 自定义位置
React Native Mapbox GL give UserLocation custom position
react-native-mapbox-gl 提供了一个 UserLocation 组件来通过内置的地理位置跟踪显示用户的位置:https://github.com/react-native-mapbox-gl/maps/blob/master/docs/UserLocation.md
不过,我想利用此组件的所有动画、渲染和轴承方面等,但要使用我自己的位置数据(至少经度、纬度和 heading/bearing)。
我目前看不到这一点,也没有在他们的回购文档中提及。
可能吗?
在基础 Android 文档中似乎是可行的:
https://docs.mapbox.com/android/maps/api/9.6.1/index.html / LocationComponent:
...You can also push location updates to the component without any internal engine management.
To achieve that, use activateLocationComponent(Context, Style, boolean) with false.
No engine is going to be initialized and you can push location updates with forceLocationUpdate(Location).
...
所以在文档中似乎没有道具或 API 所以我正在做应该安全的事情:扩展 UserLocation 组件:
export default class CustomUserLocation extends UserLocation {
static defaultProps = {
...UserLocation.defaultProps,
<your custom props here>
}
async componentDidUpdate (prevProps) {
await UserLocation.prototype.componentDidUpdate.call(this, prevProps)
...<checks for your custom props here>
}
// !! this is the key method to override
_onLocationUpdate (location) {
...
this.setState({
coordinates: <set your custom coordinates array here>,
heading: <set your custom heading here>
})
...
}
}
react-native-mapbox-gl 提供了一个 UserLocation 组件来通过内置的地理位置跟踪显示用户的位置:https://github.com/react-native-mapbox-gl/maps/blob/master/docs/UserLocation.md
不过,我想利用此组件的所有动画、渲染和轴承方面等,但要使用我自己的位置数据(至少经度、纬度和 heading/bearing)。
我目前看不到这一点,也没有在他们的回购文档中提及。 可能吗?
在基础 Android 文档中似乎是可行的: https://docs.mapbox.com/android/maps/api/9.6.1/index.html / LocationComponent:
...You can also push location updates to the component without any internal engine management.
To achieve that, use activateLocationComponent(Context, Style, boolean) with false.
No engine is going to be initialized and you can push location updates with forceLocationUpdate(Location).
...
所以在文档中似乎没有道具或 API 所以我正在做应该安全的事情:扩展 UserLocation 组件:
export default class CustomUserLocation extends UserLocation {
static defaultProps = {
...UserLocation.defaultProps,
<your custom props here>
}
async componentDidUpdate (prevProps) {
await UserLocation.prototype.componentDidUpdate.call(this, prevProps)
...<checks for your custom props here>
}
// !! this is the key method to override
_onLocationUpdate (location) {
...
this.setState({
coordinates: <set your custom coordinates array here>,
heading: <set your custom heading here>
})
...
}
}