**React Native Maps** -我如何缩放标记按下?



对于我的实习,我必须创建一个应用程序与地图视图和标记从API(标准GraphQL API)调用。但是当我点击地图时,我必须让它在标记上缩放,我不明白我怎么能做到这一点。
我找了文档,但我不明白:animateCamera(camera: Camera, {duration: number})但是什么是相机对象呢?我没有。我怎么调用animateCamera ?使用ref (_mapRef.current.animateCamera) ?

下面是我的代码:
<MapView
style={styles.map}
mapType={viewType}
provider='google'
ref={_map}
>
{users !== undefined && users.map((item, index) => (
<Marker
key={'user_' + index}
title={item.username}
description={item.posts.data.length + ' posts'}
coordinate={{
latitude: item.address.geo.lat,
longitude: item.address.geo.lng
}}
onCalloutPress={() => {
navigation.navigate('SingleUser', {user: item})
}}
/>
))}
</MapView>

Thanks for the help

PS:这是我在Stack上的第一个问题,如果我错过了一个规则,请不要粗鲁,不要犹豫告诉我!:)

PPS:为什么每次我编辑这篇文章时Stack都会删除我放在开头的"Hello"?

React Native Maps Marker有一个名为onPress的道具,你可以用它来检查何时点击了Marker

例如:

<Marker
key={'user_' + index}
title={item.username}
description={item.posts.data.length + ' posts'}
coordinate={{
latitude: item.address.geo.lat,
longitude: item.address.geo.lng
}}
onCalloutPress={() => {
navigation.navigate('SingleUser', {user: item})
}}
onPress={this.onMarkerClicked}
/>

创建onMarkerClicked函数

onMarkerClicked = () => {
_map?.current?.getCamera().then((camera) => {
camera.zoom += 1;
map?.current?.animateCamera(camera);
});

相机对象默认用于跟踪以下属性

export interface Camera {
center: LatLng;
heading: number;
pitch: number;
zoom: number;
altitude: number;
}

最新更新