😀 En esta ocasión, con nuestro proyecto🚀🚀🚀 te enseñamos el funcionamiento del 𝗔𝗽𝗶 𝗱𝗲 𝗚𝗼𝗼𝗴𝗹𝗲 𝗠𝗮𝗽𝘀 en 𝗝𝗮𝘃𝗮𝘀𝗰𝗿𝗶𝗽𝘁
Te ayudamos a crear un 🗺️Google Maps personalizado. Para esta ocasión hemos elegido un listado de hoteles de Barcelona. Aparte de 𝗽𝗼𝘀𝗶𝗰𝗶𝗼𝗻𝗮𝗿𝗹𝗼𝘀 𝗲𝗻 𝗲𝗹 𝗺𝗮𝗽𝗮, te enseñamos a incluir un «𝗶𝗻𝗳𝗼𝘄𝗶𝗻𝗱𝗼𝘄»💬, con información ℹ️ℹ️ℹ️, ventana que justamente se abre al 𝗰𝗹𝗶𝗰𝗮𝗿 𝗲𝗻 𝗲𝗹 𝗶𝗰𝗼𝗻𝗼 𝗲𝗹𝗲𝗴𝗶𝗱𝗼.
Además te mostramos como cambiar el 𝗶𝗰𝗼𝗻𝗼 𝘁𝗿𝗮𝗱𝗶𝗰𝗶𝗼𝗻𝗮𝗹 📍 de Google por uno 𝗽𝗲𝗿𝘀𝗼𝗻𝗮𝗹𝗶𝘇𝗮𝗱𝗼🏨. Y para finalizar, eliminamos 💥💥💥del mapa toda la información que google incluye por defecto.
00:00 Inicio del Vídeo
00:05 Presentación del Proyecto
01:47 Api Javascript de Google Maps
08:00 Establecemos centro del Mapa
12:12 Crear y habilitar Api Key
13:30 Operador NEW ¿qué es?
14:54 Creamos el contenedor de la lista
26:29 Añadimos los marcadores y cambiamos los iconos
34:02 Creamos los «infowindows» y hacemos que se abran al hacer clic en los iconos
41:03 Añadimos todos los nombres al listado y hacemos que al clicar en ellos se abran los infowindows
49:56 Hacemos que el zoom del mapa se adapte a las localizaciones
53:33 Personalizamos el mapa de fondo en Google Api y Conseguimos un ID
58:13 Añadimos a cada infowindow su información y las estilizamos haciendo el fondo transparente y añadiendo iconos.
Descarga el códigode nuestros 3 proyectos de APIS en Javascript en nuestra tienda👉
