En este documento, se describe la relación conceptual entre los diseños personalizados y los modos claro y oscuro, y se definen los diferentes tipos de mapas y cómo aplicarles tus diseños.
Para comenzar a usar diseños personalizados, consulta Cómo crear un diseño nuevo.
Comprende los modos claro y oscuro
Puedes crear dos diseños distintos para un solo ID de mapa: uno optimizado para fondos claros y otro para fondos oscuros. Los mapas para fondos claros usan un mapa base diferente que los mapas para fondos oscuros. Por lo tanto, no puedes usar un diseño para ambos modos.
Los diseños de los modos claro y oscuro proporcionan el mapa con diseño más adecuado para diferentes entornos. Cuando usas el ID de mapa en tus aplicaciones, tu app puede cargar el diseño adecuado según el comportamiento programado o la configuración del dispositivo del usuario.
Elige el modo claro u oscuro cuando crees un diseño
Eliges el modo claro u oscuro cuando creas o copias un diseño. No puedes cambiar el modo de un diseño después de crearlo.
Puedes verificar el tipo de diseño en la página de detalles del diseño.
Para obtener instrucciones paso a paso sobre cómo crear diseños personalizados, consulta Cómo crear y usar diseños de mapa.
Asocia un diseño de modo claro y un diseño de modo oscuro a un ID de mapa
Un ID de mapa solo admite un diseño de modo claro y un diseño de modo oscuro. Cuando haces clic en el Editar ícono para cambiar un diseño de modo claro o un diseño de modo oscuro, el panel solo muestra tus diseños para ese modo. Para obtener más información, consulta Cómo asociar tu diseño a un ID de mapa.
Comprende cómo se aplican los diseños personalizados a varios tipos de mapas
Google Maps Platform ofrece diferentes tipos de mapas para satisfacer varios casos de uso, incluidos roadmap, terrain, 2D hybrid, 3D hybrid y navigation. El nivel de personalización depende de si el mapa se basa solo en datos vectoriales (como roadmap y navigation), usa una combinación de datos vectoriales e imágenes de trama (como 2D hybrid y terrain) o usa una combinación de imágenes de trama, polígonos 3D e imágenes vectoriales (como 3D hybrid).
- Mapas de datos vectoriales
- Los tipos de mapas
roadmapynavigationsolo usan datos vectoriales, lo que te permite aplicar diseño de manera integral a la mayoría de los componentes del mapa, incluidos los polígonos para la tierra y el agua, las rutas, los puntos de referencia y los lugares de interés.
- Mapas de imágenes de trama
- Los tipos de mapas
terrain,2D hybridy3D hybridusan principalmente imágenes de trama con datos vectoriales superpuestos. Como resultado, sus capacidades de diseño son limitadas. Por lo general, solo puedes aplicar diseño a los datos vectoriales que superpones en las imágenes, como etiquetas, pines y algunas polilíneas (es decir, rutas y fronteras). No puedes personalizar los componentes que forman parte de las imágenes base, como el color de un lago o la apariencia de una cadena montañosa. - Por ejemplo, la imagen muestra la hoja de ruta con un diseño personalizado de agua rosa. Sin embargo, cuando obtienes una vista previa del diseño para los tipos de mapas de terreno e híbridos, el agua no aparece rosa.
Definiciones de tipos de mapas y compatibilidad con modos
En la siguiente tabla, se definen los tipos de mapas y se muestra qué tipos de mapas admiten los modos claro y oscuro.
| Tipo de mapa | Descripción | Imágenes del mapa base | Compatibilidad con modos |
|---|---|---|---|
roadmap |
Una vista de mapa estándar que muestra rutas y componentes principales | Vector | Ambos |
navigation |
Un tipo de mapa especializado optimizado para la guía paso a paso con el SDK de Navigation (para obtener más información sobre la navegación, consulta la descripción general de los diseños de mapa personalizados para el SDK de Navigation para Android y el SDK de Navigation para iOS) | Vector | Ambos |
terrain |
Un mapa que enfatiza los componentes físicos del terreno, como montañas, ríos y elevación | Trama | Ambos |
2D hybrid |
Una combinación de imágenes satelitales y datos de hojas de ruta que muestra nombres de calles y otros componentes clave superpuestos en las imágenes | Trama | Solo modo claro |
3D hybrid |
Un mapa 3D fotorrealista en el que puedes aplicar diseño a la visibilidad de las etiquetas de lugares de interés , las rutas y las señales de tránsito (este tipo de mapa solo está disponible en los mapas 3D de la API de Maps JavaScript) | Vectoriales y de trama | Solo modo claro |
Consideraciones de diseño para mapas de imágenes de trama
Cuando aplicas diseño a los tipos de mapas terrain, 2D hybrid y 3D hybrid, es posible que veas los siguientes comportamientos:
Cuando usas diseños personalizados en Android y iOS con el tipo de mapa
terrain, es posible que notes que el agua parpadea temporalmente. Este comportamiento esperado ocurre cuando se aplica diseño al agua porque los mosaicos de la hoja de ruta se cargan después de los mosaicos del terreno. Esta carga retrasada provoca un breve conflicto visual en los colores personalizados.Los diseños de polígonos pueden ocluir los elementos del mapa subyacentes en los tipos de mapas
terrainy2D hybrid. Por ejemplo, un polígono de parque estilizado en un mapa de terreno puede ocultar componentes sutiles del terreno. En un mapa híbrido 2D, puede ocultar las imágenes satelitales subyacentes.En el caso de
3D hybrid, las polilíneas de las rutas pueden renderizarse debajo de los puentes o aparecer de forma incorrecta alrededor de los pasos elevados y los pasos inferiores.En el caso de los tipos de mapas
3D hybrid, no puedes modificar la configuración del mapa para controlar la densidad de los lugares de interés y el diseño de los edificios y los puntos de referencia.
Obtén una vista previa de tus diseños en cada tipo de mapa
Después de crear tus diseños personalizados, pruébalos en los diferentes tipos de mapas para ver cómo se aplican. Esto es especialmente importante porque no todos los diseños se aplican a todos los tipos de mapas.
En Google Cloud Console, puedes obtener una vista previa de tus diseños personalizados en el editor de diseño o en la página de detalles del mapa, de la siguiente manera:
- Editor de diseño: En el panel contextual, selecciona la lista desplegable
Map typey cambia el tipo de mapa. El mapa se actualiza y muestra el tipo de mapa con el diseño aplicado. - Página de detalles del mapa: En la sección Vista previa del mapa , puedes alternar entre los diseños de los modos claro y oscuro, y cambiar la variante en la lista desplegable a diferentes tipos de mapas. Primero debes asociar tu diseño al ID de mapa para poder obtener una vista previa.
Aplica tus diseños personalizados a varios tipos de mapas
En la página de detalles del mapa, después de asociar tus diseños de los modos claro y oscuro a tu ID de mapa, haz clic en Mostrar más para elegir si deseas aplicar tus diseños personalizados a varios tipos de mapas. Puedes volver a verificar cómo se aplica el diseño a los tipos de mapas en la sección Vista previa del mapa.