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 Crea 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 al de 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 Crea y usa 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 admite solo 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 Asocia 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, navigation, hybrid, terrain, 3D roadmap y
3D hybrid. El nivel de personalización depende de si el mapa se basa solo
en datos vectoriales (como roadmap, navigation y 3D roadmap), usa una combinación
de datos vectoriales e imágenes de trama (como terrain y hybrid) 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
roadmap,navigationy3D roadmapusan solo datos vectoriales, lo que te permite diseñar de forma integral la mayoría de los componentes de 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,hybrid, y3D hybridusan imágenes de trama con datos vectoriales en la parte superior. Como resultado, sus capacidades de diseño son limitadas. Por lo general, solo puedes diseñar datos vectoriales que se superponen en las imágenes, como etiquetas, pines y algunas polilíneas (como rutas y bordes). No puedes personalizar los componentes que forman parte de las imágenes base. - Por ejemplo, en la siguiente imagen, se muestra un diseño con un tema azul. El agua tiene un diseño más oscuro que el predeterminado, y se aplica una paleta azul a las rutas, las áreas exteriores y los PDI. Cuando obtienes una vista previa del diseño en los mapas híbridos y 3D híbridos, el agua y las áreas exteriores no son azules, pero las rutas y los PDI aún tienen diseño.
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 | Modo claro y oscuro |
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 | Modo claro y oscuro |
terrain |
Un mapa que enfatiza los componentes físicos del terreno, como montañas, ríos y elevación | Vectoriales y de trama | Modo claro y oscuro |
hybrid |
Una combinación de imágenes satelitales y datos de mapas de ruta que muestra nombres de calles y otros componentes clave superpuestos en las imágenes | Vectoriales y de trama | Solo modo claro |
3D roadmap |
Un mapa estándar 3D que muestra rutas y componentes principales (este tipo de mapa solo está disponible en los mapas 3D de la API de Maps JavaScript) | Vector | Solo modo claro |
3D hybrid |
Un mapa 3D fotorrealista en el que puedes diseñar la visibilidad de las etiquetas de lugares de interés , las rutas y los carteles viales (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 diseñes los tipos de mapas terrain, 2D hybrid, 3D hybrid y 3D roadmap, 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 diseña el agua porque los mosaicos de mapas de ruta se cargan después de los mosaicos de terreno. Esta carga retrasada provoca un breve conflicto visual en los colores personalizados.Los diseños de polígonos pueden ocluir los elementos de mapa subyacentes en los tipos de mapas
terrain,2D hybridy3D hybrid. Por ejemplo, un polígono de parque estilizado en un mapa de terreno puede ocultar componentes sutiles del terreno. En los mapas híbridos, puede ocultar las imágenes satelitales subyacentes.En el caso de
3D hybrid, las polilíneas de ruta 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 roadmapy3D hybrid, no puedes modificar la configuración del mapa para controlar la densidad de los lugares de interés, el diseño de los edificios, el diseño de los puntos de referencia y el color de fondo de la app.
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 en 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 de contexto, 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 modo 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 modo 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.