Кто-нибудь был в состоянии использовать реактивные карты с картами Google?

Question

У меня в настоящее время есть реактивный проект, использующий реактивные карты и Viro. Для Viro требуется версия рН 0,59,9, поэтому я не использую последнюю версию в этом проекте.

В настоящее время он настроен на использование встроенных карт Apple при использовании симулятора iPhone, который работает нормально и У меня также работает Виро. Следующий шаг - начать добавлять указания из местоположения текущего пользователя в разные места вокруг него, и я планировал использовать Google Maps для этого.

К сожалению, у меня много проблем, пытающихся сделать это и имеющих не повезло, работая с установочной документацией .

Мой пакет. json в настоящее время выглядит так:

{
  "name": "LoveWinchester",
  "version": "0.0.1",
  "private": true,
  "scripts": {
    "start": "node node_modules/react-native/local-cli/cli.js start",
    "test": "jest",
    "postinstall": "jetifier -r"
  },
  "dependencies": {
    "axios": "^0.19.0",
    "react": "16.8.3",
    "react-native": "0.59.9",
    "react-native-gesture-handler": "~1.4.0",
    "react-native-maps": "0.26.1",
    "react-native-reanimated": "^1.4.0",
    "react-native-screens": "^1.0.0-alpha.23",
    "react-navigation": "^4.0.10",
    "react-navigation-stack": "^1.10.3",
    "react-viro": "2.17.0",
    "rn-bottom-drawer": "^1.4.3"
  },
  "devDependencies": {
    "@babel/core": "^7.7.2",
    "@babel/runtime": "^7.7.2",
    "babel-jest": "^24.9.0",
    "jest": "^24.9.0",
    "jetifier": "^1.6.4",
    "metro-react-native-babel-preset": "^0.57.0",
    "react-test-renderer": "16.8.3"
  },
  "jest": {
    "preset": "react-native"
  }
}

А мой Podfile выглядит следующим образом:

target 'LoveWinchester' do
platform :ios, '9.3'
  pod 'ViroReact', :path => '../node_modules/react-viro/ios/'
  pod 'ViroKit_static_lib', :path => '../node_modules/react-viro/ios/dist/ViroRenderer/static_lib'
  pod 'RNReanimated', :path => '../node_modules/react-native-reanimated'

  pod 'RNGestureHandler', :path => '../node_modules/react-native-gesture-handler'

  pod 'RNScreens', :path => '../node_modules/react-native-screens'

  pod 'react-native-maps', :path => '../node_modules/react-native-maps'

end

Любая помощь будет очень признательна !!

Answer 1

1. Добавлен модуль GoogleMaps

pod 'GoogleMaps'

после этого перейдите в iOS папку & установить it

cd ios
pod install

Теперь вы, вероятно, получите ошибку react-native-maps: AirGoogleMaps dir must be added to your xCode project to support GoogleMaps on iOS.

Чтобы решить эту проблему, откройте папку от go до iOS и откройте . xcworkspace файл, потому что теперь вам нужно добавить AirGoogleMaps в проект.

Go в ваш node_modules в вашем проекте и перейдите в папку AirGoogleMaps .

/node_modules/react-native-maps/lib/ios/AirGoogeMaps

Перетащите AirGoogleMaps папка в ваш проект. После добавления этой папки в ваш проект появится всплывающее окно, в котором вы укажете Создать группы . (Не создавать ссылки на папки)

Затем go внутри xcode > build settings > Preprocessor Macros > и добавьте HAVE_GOOGLE_MAPS=1 Макрос препроцессора для настройки сборки Чтобы использовать Google Maps, вам необходимо создать ключ API Карт Google .

После этого go до AppDelegate.m и добавьте следующие строки в ваш код

#import <GoogleMaps/GoogleMaps.h>

[GMSServices provideAPIKey:@"YOUR_API_KEY"]

Наконец, измените MapView component

import MapView, {PROVIDER_GOOGLE} from "react-native-maps";

<MapView provider={PROVIDER_GOOGLE} />

Вот и все. Надеюсь, это поможет вам. Не стесняйтесь сомнений.

Для получения дополнительной информации отметьте это