react-native-maps 相关问题

React Native Maps是Airbnb开发的一组组件，用于在Android和iOS上使用React Native框架渲染地图组件。基础开发人员指南和示例项目可在以下网址获得：https：//github.com/airbnb/react-native-maps

React Native 地图，将自定义标记保留在中心

所以我有一个带有自定义标记的 MapView 所以我有一个带有自定义标记的 MapView <MapView ref={mapRef} provider={PROVIDER_GOOGLE} style={{ width: '100%', height: '100%', borderRadius: 10, }} initialRegion={{ latitude: location?.coords.latitude || 1.290270, longitude: location?.coords.longitude || 103.851959, latitudeDelta: 0.0922, longitudeDelta: 0.0421, }} zoomEnabled={true} minZoomLevel={16} maxZoomLevel={18} mapType={'standard'} showsBuildings={false} showsTraffic={false} showsIndoors={false} showsPointsOfInterest={false} showsIndoorLevelPicker={false} customMapStyle={Theme.maps.lightMode} > <> {isEnabled && ( <Marker key={'currentUserLocation'} coordinate={{ latitude: location?.coords.latitude || 1.290270, longitude: location?.coords.longitude || 103.851959, }} style={{zIndex: 9999}} > <MyProfileMarker/> </Marker> )} </> </MapView> 还有一个具有自定义设计的轮廓标记： export default function MyProfileMarker() { return ( <View style={styles.container}> <Icon name="map-marker-outline" size={wp('9%')} color={theme.colors.danger['600']}/> </View> ); } 但是Marker没有正确放置在位置坐标中： const styles = StyleSheet.create({ container: { width: wp('80%'), height: wp('80%'), // Full circle borderRadius: wp('40%'), alignItems: 'center', justifyContent: 'center', padding: 2, backgroundColor: 'rgba(183,56,68,0.1)', // 'rgba(255,255,255,0.2) }, }); 看起来像这样作为参考，这是标记应该所在的位置，红色圆圈来自图钉尝试添加这个对我有用的锚点

react-native react-native-maps

回答 1 投票 0

无法调用 RNfusedlocation.getCurrentPosition -react-native-geolocation-service

react-native-geolocation-service(^5.3.1) 在调用 Geolocation.getCurrentPosition() 时抛出此错误或应用程序崩溃。我添加react-native-maps(^1.8.0) lib后开始出现错误...

javascript reactjs react-native react-native-maps

回答 1 投票 0

react-native-maps 覆盖图像在 iOS 中放大时消失

我正在使用react-native-maps（https://github.com/react-native-community/react-native-maps）库来显示地图。使用的MapType是卫星，我还使用了overlay api来显示overlay im...

ios react-native overlay react-native-maps

回答 1 投票 0

React-native-map 条件标记图标

我正在将标记渲染到react-native-map应用程序中。所以我在后端 API 中为每个标记定义了一个类型。现在我想使用自定义图标显示它们。目前我单独渲染每种类型...

react-native react-native-maps

回答 1 投票 0

替换 React Native 地图中的标记图像

我的容器中有多个图标。我想更改标记的 on onPress={locationTapped} 操作。不过，就算我强迫……

react-native react-native-maps

回答 1 投票 0

根据用户的方向生成标记

我正在制作一个反应本机应用程序，在其中显示公交车的实时位置。我正在使用反应本机地图。标记和实时位置工作正常，但我无法找到标记......

javascript react-native expo react-native-maps

回答 2 投票 0

使用react-native地图时从AndroidManifest.xml中删除Google地图api密钥

我们在 React Native 应用程序中使用 React-Native 地图。我们的 PenTesting 团队在从 jadx 中提取 apk 后要求删除 AndroidManifest.xml 文件中的 Google 地图 api 密钥 - https://github.com/skylot/

react-native-navigation react-native-maps

回答 1 投票 0

react-native-maps - 你可以关闭一个事件吗？

在 MapView 事件中，例如 onRegionChange，有没有办法消除它——也就是说，让它不执行？

react-native events react-native-maps

回答 1 投票 0

React-native 风格“transform:rotate”不同的行为 iOS 和 Android

我正在使用 React Native 开发一个移动应用程序，在地图上显示车辆。每辆车都用箭头图像表示，并指示车辆的方向，我通过应用来做到这一点...

android ios react-native react-native-maps

回答 1 投票 0

React Native MapViewDirections：强制整个路线保持在视图中？

我正在按照本指南使用 React Native 中的 MapViewDirections 在地图上的两点之间绘制路线。我可以通过指定纬度将起点和终点保留在视图内...

reactjs react-native google-maps google-maps-api-3 react-native-maps

回答 1 投票 0

使用获取的坐标导航有效负载进行导航时，Android 上的世博会位置崩溃

我正在使用世博会位置，我想在获取坐标对象后导航到地图[视图页面。我的目标是，当我按下按钮时，系统会提示我到我所在的位置，并缩放至

react-native expo react-native-maps

回答 1 投票 0

无法使用 Metro 捆绑程序解决“../Utilities/Platform”错误

我使用 React Native 与 Expo、Expo Router 和 Metro 来构建地图应用程序。我使用了react-native-maps包。 React-native-maps 不适用于网络（https://docs.expo.dev/versions/late...

react-native expo react-native-maps metro-bundler

回答 1 投票 0

React Native 错误 - VirtualizedList 永远不应该嵌套在普通 ScrollView 中

我正在开发一个react-native应用程序，我必须将GooglePlacesAutocomplete放在Scrollview中。这是以下代码。我正在开发一个反应原生应用程序，我必须将 GooglePlacesAutocomplete 放入滚动视图中。这是以下代码。 <ScrollView style={{flex: 1}> <GooglePlacesAutocomplete minLength={2} nearbyPlacesAPI={'GooglePlacesSearch'} debounce={400} placeholder="Origin Address" query={{ key: GOOGLE_MAPS_API_KEY, language: 'en', }} onFail={error => console.log(error)} enablePoweredByContainer={false} onPress={(data, details = null) => { console.log(details.geometry.location); }} fetchDetails={true} returnkeyType={'search'} /> </ScrollView> Errors：VirtualizedList 永远不应该嵌套在具有相同方向的普通 ScrollView 中，因为它可能会破坏窗口和其他功能 - 请改用另一个 VirtualizedList 支持的容器。当您在 ScrollView 中添加垂直 flatList 时出现此错误，因此请尝试以下之一：将平面列表更改为水平列表禁用平面列表滚动（来自docsdisableScroll={false}）。在 ScrollView 之外使用平面列表，就像在模态中一样。根据react-native-google-places-autocomplete 文档有一节说：在 or 内部使用如果您需要将此组件包含在 ScrollView 或 FlatList 中，请记住将 KeyboardShouldPersistTaps 属性应用于所有祖先 ScrollView 或 FlatList（请参阅 this 问题评论）。 <ScrollView style={{flex: 1} nestedScrollEnabled={true} // <---- 1. > <GooglePlacesAutocomplete minLength={2} nearbyPlacesAPI={'GooglePlacesSearch'} debounce={400} placeholder="Origin Address" query={{ key: GOOGLE_MAPS_API_KEY, language: 'en', }} onFail={error => console.log(error)} enablePoweredByContainer={false} onPress={(data, details = null) => { console.log(details.geometry.location); }} fetchDetails={true} returnkeyType={'search'} disableScroll={true} // <--- 2. this works /> 这是一件困难的事。我可以通过添加 horizontal 和 keyboardShouldPersistTaps 道具来解决这个问题。这可能会导致问题，由于设置的样式，地址列表不会显示。您可能需要使用 <Scrollview/> 添加一些样式到 contentContainerStyle. 这个伪代码对我有用。 <ScrollView horizontal={true} contentContainerStyle={{ flexDirection: 'column', justifyContent: 'space-around', width: '100%', }} keyboardShouldPersistTaps={'handled'}> <GooglePlacesAutocomplete disableScroll={false} /> </ScrollView> <ScrollView horizontal={true} showsHorizontalScrollIndicator={false} > <FlatList horizontal={true} showsHorizontalScrollIndicator={false} **scrollEnabled={false}** // ..... /> </ScrollView> 这对我有用。在平面列表上将scrollEnabled设置为 false 删除了警告

react-native react-native-maps react-google-places-autocomplete

回答 4 投票 0

在react-native中，使用react-native-maps，如何以编程方式结束标记拖动？

我的应用程序显示一个带有多边形边界和中间有一个标记的地图。标记是可拖动的。当应用程序检测到标记已被拖动到边界之一时，我想...

javascript react-native react-native-maps

回答 1 投票 0

如何在React Native中创建完整的世界地图？

我想创建一个完整的世界地图，我可以根据提供的数据绘制一些点。我已经尝试了许多 React Native 库，但我没有从中得到任何解决方案。这是一张...

reactjs react-native maps react-native-maps world-map

回答 3 投票 0

如何从 Firestore 高效读取数据

我在 firestore 上给了 20,000 个对象，都在一个集合中，但每个对象都是一个文档（我想他们称之为地图）。对象不大，每个可能有 200-400 个字符对象 h...