Eso es todo.

Para comenzar a desarrollar, consulta nuestra documentación para desarrolladores.

Activar el Google Maps SDK for iOS

Para que puedas comenzar, te proporcionaremos orientación en la Google Developers Console a fin de que hagas primero algunas acciones:

  1. Crear o seleccionar un proyecto
  2. Activar el Google Maps SDK for iOS
  3. Crear claves correspondientes
Continuar

Ajuste rápido de estilo del mapa: Modo nocturno

Esta página es una guía rápida para ajustar el estilo de tu mapa, usando un modo nocturno como ejemplo.

Información general

Con las opciones de estilo, puedes personalizar la presentación de los estilos de mapas estándares de Google y cambiar la representación visual de ciertas características, como carreteras, parques, negocios y otros puntos de interés. Esto significa que puedes resaltar determinados componentes del mapa o hacer que este complemente el estilo de tu app.

La aplicación de ajustes de estilo solo funciona en el tipo de mapa kGMSTypeNormal.

Aplica estilos a tu mapa

Si deseas aplicar estilos de mapa personalizados a un mapa, llama a GMSMapStyle(...) para crear una instancia de GMSMapStyle y pasa una URL para un archivo JSON local o una string JSON con definiciones de estilo. Asigna la instancia de GMSMapStyle a la propiedad mapStyle del mapa.

Usa un archivo JSON

En los siguientes ejemplos se muestra la manera de llamar a GMSMapStyle(...) y pasar una URL para un archivo local:

Swift

En el siguiente código de ejemplo se supone que tu proyecto contiene un archivo llamado style.json:

import UIKit
import GoogleMaps

class ViewController: UIViewController {

  // Set the status bar style to complement night-mode.
  override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent
  }

  override func loadView() {
    let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 14.0)
    let mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera)

    do {
      // Set the map style by passing the URL of the local file.
      if let styleURL = Bundle.main.url(forResource: "style", withExtension: "json") {
        mapView.mapStyle = try GMSMapStyle(contentsOfFileURL: styleURL)
      } else {
        NSLog("Unable to find style.json")
      }
    } catch {
      NSLog("One or more of the map styles failed to load. \(error)")
    }

    self.view = mapView
  }
}

Objective C

En el siguiente código de ejemplo se supone que tu proyecto contiene un archivo llamado style.json:

#import "ViewController.h"
@import GoogleMaps;

@implementation ViewController

// Set the status bar style to complement night-mode.
- (UIStatusBarStyle)preferredStatusBarStyle {
  return UIStatusBarStyleLightContent;
}

- (void)loadView {
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                          longitude:151.20
                                                               zoom:12];
  GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
  mapView.myLocationEnabled = YES;

  NSBundle *mainBundle = [NSBundle mainBundle];
  NSURL *styleUrl = [mainBundle URLForResource:@"style" withExtension:@"json"];
  NSError *error;

  // Set the map style by passing the URL for style.json.
  GMSMapStyle *style = [GMSMapStyle styleWithContentsOfFileURL:styleUrl error:&error];

  if (!style) {
    NSLog(@"The style definition could not be loaded: %@", error);
  }

  mapView.mapStyle = style;
  self.view = mapView;
}
@end

Para definir las opciones de estilo, agrega un archivo nuevo a tu proyecto llamado style.json y pega la siguiente declaración de estilo JSON para el ajuste de estilo de modo nocturno:

Usa un recurso de string

En los siguientes ejemplos se muestra la manera de llamar a GMSMapStyle(...) y pasar un recurso de string:

Swift

import UIKit
import GoogleMaps

let kMapStyle = "[" +
"  {" +
"    \"featureType\": \"poi.business\"," +
"    \"elementType\": \"all\"," +
"    \"stylers\": [" +
"      {" +
"        \"visibility\": \"off\"" +
"      }" +
"    ]" +
"  }," +
"  {" +
"    \"featureType\": \"transit\"," +
"    \"elementType\": \"labels.icon\"," +
"    \"stylers\": [" +
"      {" +
"        \"visibility\": \"off\"" +
"      }" +
"    ]" +
"  }" +
"]"
class ViewController: UIViewController {

  // Set the status bar style to complement night-mode.
  override var preferredStatusBarStyle: UIStatusBarStyle {
    return .lightContent
  }

  override func loadView() {
    let camera = GMSCameraPosition.camera(withLatitude: -33.86, longitude: 151.20, zoom: 14.0)
    let mapView = GMSMapView.map(withFrame: CGRect.zero, camera: camera)

    do {
      // Set the map style by passing a valid JSON string.
      mapView.mapStyle = try GMSMapStyle(jsonString: kMapStyle)
    } catch {
      NSLog("One or more of the map styles failed to load. \(error)")
    }

    self.view = mapView
  }
}

Para definir las opciones de estilo, pega la siguiente string de estilo como valor de la variable kMapStyle:

Objective C

#import "ViewController.h"
@import GoogleMaps;

// Paste the JSON string to use.
static NSString *const kMapStyle = @"JSON_STYLE_GOES_HERE";

@implementation ViewController

// Set the status bar style to complement night-mode.
- (UIStatusBarStyle)preferredStatusBarStyle {
  return UIStatusBarStyleLightContent;
}

- (void)loadView {
  GMSCameraPosition *camera = [GMSCameraPosition cameraWithLatitude:-33.86
                                                          longitude:151.20
                                                               zoom:12];
  GMSMapView *mapView = [GMSMapView mapWithFrame:CGRectZero camera:camera];
  mapView.myLocationEnabled = YES;

  NSError *error;

  // Set the map style by passing a valid JSON string.
  GMSMapStyle *style = [GMSMapStyle styleWithJSONString:kMapStyle error:&error];

  if (!style) {
    NSLog(@"The style definition could not be loaded: %@", error);
  }

  mapView.mapStyle = style;
  self.view = mapView;
}

@end

Para definir las opciones de estilo, pega la siguiente string de estilo como valor de la variable kMapStyle:

Declaraciones de estilo JSON

En los mapas con ajustes de estilo se usan dos conceptos para aplicar colores y otros cambios de estilo a un mapa:

  • Los selectores especifican los componentes geográficos a los cuales puedes aplicar estilo en el mapa. Entre estos componentes se incluyen carreteras, parques y masas de agua, entre otros, además de sus etiquetas. Entre los selectores se incluyen funciones y elementos, que se especifican como propiedades featureType y elementType.
  • Los parámetros de estilo son propiedades de color y visibilidad que puedes aplicar a elementos del mapa. Definen el color de visualización a través de una combinación de valores de matriz, color y luminosidad o gama.

Consulta la referencia de estilo para acceder a una descripción detallada de las opciones de ajuste de estilo de JSON.

Google Maps APIs Styling Wizard

Usa Google Maps APIs Styling Wizard como método rápido para generar un objeto de ajuste de estilo JSON. El Google Maps SDK for iOS admite las mismas declaraciones de estilo que la Google Maps JavaScript API.

Ejemplos de código completos

En el repositorio de ApiDemos de GitHub se incluyen ejemplos en los cuales se muestra el uso de los ajustes de estilo.

Siguiente paso

Consulta la sección sobre ocultamiento de características del mapa con ajustes de estilo.

Enviar comentarios sobre...

Google Maps SDK for iOS
Google Maps SDK for iOS
Si necesitas ayuda, visita nuestra página de asistencia.