Agrega un mapa

Selecciona la plataforma: Android iOS JavaScript

En la API, los mapas se representan con la clase GMSMapView, que es una subclase de UIView. El mapa es el objeto más significativo del SDK de Maps para iOS y proporciona los métodos necesarios para agregar, quitar y administrar otros objetos, como marcadores y polilíneas.

Introducción

El SDK de Maps para iOS te permite mostrar un mapa de Google en tu aplicación para iOS. Estos mapas tienen la misma apariencia que los que ves en la app de Google Maps para iOS, y el SDK expone muchas de las mismas funciones.

Además de la funcionalidad de mapas, la API también admite una variedad de interacciones que son coherentes con el modelo de IU de iOS. Por ejemplo, puedes configurar interacciones con un mapa definiendo objetos de respuesta que reaccionen a los gestos del usuario, como presionar y presionar dos veces.

La clase clave cuando se trabaja con un objeto Map es la clase GMSMapView. GMSMapView controla automáticamente las siguientes operaciones:

  • Conexión al servicio de Google Maps
  • Descarga de mosaicos de mapa
  • Visualización de mosaicos en la pantalla del dispositivo
  • Visualización de varios controles, como el desplazamiento lateral y el zoom
  • Respuesta a gestos de desplazamiento lateral y zoom a través del movimiento del mapa y su acercamiento o alejamiento
    • Inclinar el ángulo de visión del mapa para responder a gestos de dos dedos

Además de estas operaciones automáticas, puedes controlar el comportamiento y el aspecto del mapa a través de las propiedades y los métodos que expone la clase GMSMapView. GMSMapView te permite agregar y quitar marcadores, superposiciones de terreno y polilíneas, cambiar el tipo de mapa que se muestra y controlar lo que se muestra en el mapa a través de la clase GMSCameraPosition.

Cómo compilar Maps con SwiftUI

SwiftUI ofrece una forma adicional de crear una IU con un enfoque declarativo. Le indicas a SwiftUI cómo quieres que se vea tu vista junto con todos los diferentes estados para ella, y el sistema hace el resto. SwiftUI controla la actualización de la vista cada vez que cambia el estado subyacente debido a un evento o una acción del usuario.

El SDK de Maps para iOS se compila sobre UIKit y no proporciona una vista compatible con SwiftUI. Para agregar mapas en SwiftUI, debes cumplir con UIViewRepresentable o UIViewControllerRepresentable. Para obtener más información, consulta el codelab Cómo agregar un mapa a tu app para iOS con SwiftUI.

Cómo agregar un mapa

Los pasos básicos para agregar un mapa son los siguientes:

  1. Para obtener el SDK, obtener una clave de API y agregar los frameworks necesarios, sigue los pasos que se indican en los siguientes artículos:

    1. Configuración en la consola de Google Cloud

    2. Cómo utilizar una clave de API

    3. Cómo configurar un proyecto de Xcode

    4. En tu AppDelegate, proporciona tu clave de API al método de la clase provideAPIKey: en GMSServices.

    5. Crea o actualiza un ViewController. Si el mapa se muestra cuando este controlador de vista se vuelve visible, asegúrate de crearlo dentro del método viewDidLoad.

    6. Cuando inicialices la vista del mapa, establece las opciones de configuración con GMSMapViewOptions. Las propiedades incluyen frame, camera, mapID,backgroundColor o screen.

    7. Establece la propiedad camera de las opciones del mapa con un objeto GMSCameraPosition. Esto especifica el centro y el nivel de zoom del mapa.

    8. Crea una instancia de una clase GMSMapView con el método options: de GMSMapView. Si este mapa se usará como la única vista del controlador de vista, el valor predeterminado de frame de la opción de mapa CGRectZero se puede usar como frame de la vista. El tamaño del mapa se cambia automáticamente.

    9. Establece el objeto GMSMapView como la vista del controlador de vista. Por ejemplo, self.view = mapView;

En el ejemplo siguiente se incluye un mapa, posicionado en el centro de Singapur, a una aplicación.

Swift

import GoogleMaps

class MapObjects : UIViewController {
  override func viewDidLoad() {
    super.viewDidLoad()

    let options = GMSMapViewOptions()
    options.camera = GMSCameraPosition(latitude: 1.285, longitude: 103.848, zoom: 12)
    options.frame = self.view.bounds;

    let mapView = GMSMapView(options:options)
    self.view = mapView
  }
}

Objective-C

- (void)viewDidLoad {
  [super viewDidLoad];

  GMSMapViewOptions *options = [[GMSMapViewOptions alloc] init];
  options.camera = [GMSCameraPosition cameraWithLatitude:1.285
                                                        longitude:103.848
                                                             zoom:12];
  options.frame = self.view.bounds;

  GMSMapView *mapView = [[GMSMapView alloc] initWithOptions:options];
  self.view = mapView;
}

Una vez que hayas seguido estos pasos, podrás configurar aún más el objeto GMSMapView.

¿Qué sigue?

Después de completar estos pasos, puedes configurar la configuración del mapa.