首页 > 解决方案 > 居中地图,同时捏缩放像优步一样反应原生

问题描述

如何像优步应用程序那样做?

<View>
    <MapView
        onRegionChangeComplete={(e) => {
            setLocalLocation({
                latitude: e.latitude,
                longitude: e.longitude,
            });
        }}
        initialRegion={{
            latitude: localLocation.latitude,
            longitude: localLocation.longitude,
            latitudeDelta: 0.004,
            longitudeDelta: 0.0021,
        }}
    />
    <MapMarker />
</View>

我有一个以地图为中心的标记,我希望缩放集中在标记上,就像 Uber 应用程序一样。

const MapMarker = ({ theme }) => {
    return (
        <View
            pointerEvents="none"
            style={{
                position: 'absolute',
                top: 0,
                bottom: 30,
                left: 0,
                right: 0,
                alignItems: 'center',
                justifyContent: 'center',
            }}
        >
            <IconComponent name="location" size={30} color={theme.colors.primaryIcon} />
        </View>
    );
};

如何正确控制 latitudeDelta 和 longitudeDelta 以获得与 Uber 应用程序相同的结果?

标签: reactjsreact-nativereact-native-maps

解决方案


推荐阅读