Карта Google не отображается в проекте React Native ExpoAndroid

Форум для тех, кто программирует под Android
Ответить
Anonymous
 Карта Google не отображается в проекте React Native Expo

Сообщение Anonymous »

Это проект React Native (Expo), над которым я работаю, и я пытаюсь отобразить карту Google в этом компоненте, но она не отображается, несмотря на то, что все сделано правильно и без ошибок.
Вот мой код ниже:
import { StyleSheet, Text, View, Image } from "react-native";
import MapView, { Marker, PROVIDER_GOOGLE } from "react-native-maps"; // Import MapView
import * as Location from 'expo-location';
import React, { useState, useEffect, useRef } from "react";
import { carsAround } from "../../dummyData/data";

const RegularMapView = () => {
const [latlong, setLatlong] = useState({});
const _map = useRef(null);

const requestLocationPermission = async () => {
const { status } = await Location.requestForegroundPermissionsAsync();
if (status !== 'granted') {
console.error("Location permission denied");
return false; // Or handle permission denial here
}
return true;
};

const getLocation = async () => {
try {
const hasPermission = await requestLocationPermission();
if (!hasPermission) return;

const { coords: { latitude, longitude } } = await Location.getCurrentPositionAsync();
setLatlong({ longitude, latitude });
console.log("User coordinates:", latlong);
} catch (err) {
console.error("Error getting location:", err);
}
};

useEffect(() => {
getLocation(); // Call getLocation on component mount
}, []);

return (


{carsAround.map((item, index) => (



))}


);
};

export default RegularMapView;

const styles = StyleSheet.create({
container: {
flex: 1,
width: "100%",
height: "100%",
justifyContent: "center",
alignItems: "center",
},
map: {
...StyleSheet.absoluteFillObject,

},
});


Вот мой app.json:
{
"expo": {
"name": "****",
"slug": "*******",
"version": "1.0.0",
"orientation": "portrait",
"icon": "./assets/images/appIcon.png",
"userInterfaceStyle": "light",
"splash": {
"image": "./assets/images/icon.png",
"resizeMode": "contain",
"backgroundColor": "#000066"
},
"assetBundlePatterns": [
"**/*"
],
"ios": {
"supportsTablet": true
},
"android": {
"adaptiveIcon": {
"foregroundImage": "./assets/images/adaptive.png",
"backgroundColor": "#000066"
},
"package": "com.rodnav",
"config": {
"googleMaps": {
"apiKey": "*************"
},
"permissions": [
"ACCESS_COARSE_LOCATION",
"ACCESS_FINE_LOCATION",
"FOREGROUND_SERVICE"
]
}
},
"web": {
"favicon": "./assets/images/icon.png"
},
"extra": {
"eas": {
"projectId": "***********"
}
},
"plugins": [
"expo-font"
]
}
}


Я могу успешно показать координаты своего местоположения в консоли, что означает, что настройка работает, однако карта по-прежнему не отображается.
LOG User coordinates: {"latitude": 37.4219983, "longitude": -122.084}
LOG User coordinates: {"latitude": 37.4219983, "longitude": -122.084}
LOG User coordinates: {"latitude": 37.4219983, "longitude": -122.084}
LOG User coordinates: {"latitude": 37.4219983, "longitude": -122.084}
LOG User coordinates: {"latitude": 37.4219983, "longitude": -122.084}
LOG User coordinates: {"latitude": 37.4219983, "longitude": -122.084}


Подробнее здесь: https://stackoverflow.com/questions/784 ... po-project
Ответить

Быстрый ответ

Изменение регистра текста: 
Смайлики
:) :( :oops: :roll: :wink: :muza: :clever: :sorry: :angel: :read: *x)
Ещё смайлики…
   
К этому ответу прикреплено по крайней мере одно вложение.

Если вы не хотите добавлять вложения, оставьте поля пустыми.

Максимально разрешённый размер вложения: 15 МБ.

Вернуться в «Android»