Перейти к основному содержимому

API карт и мест

FlutterFlow нативно поддерживает Google Maps, предоставляя простой и эффективный способ встраивания интерактивных карт в приложения FlutterFlow. Также поддерживается Places API, который возвращает отформатированные данные о местоположении и изображения заведений, географических объектов или заметных точек интереса.

Добавление API карт​

Чтобы включить Google Maps в ваш проект, следуйте этим шагам:

Получение ключей API​

Чтобы начать работу с Google Maps APIs, необходимо включить Maps API в Консоли Google Cloud.

  1. При переходе в консоль Cloud убедитесь, что вы находитесь в правильном проекте Google Cloud. Затем в правом меню нажмите на Library и выполните поиск по запросу Maps.

  2. Возможно, Google Cloud предложит добавить аккаунт для оплаты. Добавьте аккаунт для оплаты, чтобы продолжить.

  3. Вы увидите варианты, такие как Maps SDK for iOS, Maps SDK for Android и Maps Javascript API. Выберите платформу, которую хотите поддерживать, и нажмите Enable. Если вы работаете в режиме Run, убедитесь, что Maps Javascript API включен.

warning

Чтобы защитить ключи API, ознакомьтесь с руководством по лучшим практикам: Защита ключей API

  • Нажмите на меню Credentials в левой панели.

  • Найдите ключ для нужной платформы и скопируйте его.

Добавление ключей в FlutterFlow​

Теперь добавьте ключи API для каждой платформы на странице настроек FlutterFlow

g-maps-settings.png

Создание нового ключа, если его нет​

Если в консоли разработчика Google вы не находите ключ для Android (автоматически созданный Firebase) или ключ для iOS (автоматически созданный Firebase), вот шаги для создания:

  • В консоли Cloud нажмите на меню Credentials слева.

  • Нажмите + Create Credentials в верхней части.

  • Нажмите API Key, чтобы создать новый ключ для приложения Android. Аналогично создайте ключ для iOS и Web.

Добавление API мест​

Вы можете включить Places API в консоли Google Cloud — убедитесь, что вы находитесь в правильном проекте Google Cloud. Обратите внимание, что текущий виджет PlacePicker использует устаревший Places API. Мы планируем вскоре обновить виджет PlacePicker для поддержки нового API. В ожидании этого убедитесь, что устаревший Places API включен для полной функциональности.

places-api.png