Excelente video, me ha ayudado un monton a mi proyecto, muy bien explicados los pasos y las funciones que ofrece la libreria de manera individual para una mejor comprensión del codigo un 10, y la verdad un poco gracioso ese minuto 15:40
@@taurusdark7656 Hola Taurus, sisi eso se puede hacer, tenes que aclarar en el servicio de autocompletado que queres recibir solo "establishment". Te dejo documentacion con ejemplos. developers.google.com/maps/documentation/javascript/place-autocomplete?hl=es-419 github.com/googlemaps/js-samples/blob/6a8598f2cbf6c57eca8c1c9b83b6629a21d34e21/dist/samples/places-autocomplete-multiple-countries/docs/index.js#L20-L37
Muchas gracias por compartir tus conocimientos... Lastima que obligatoriamente hay que hacer la parte de facturacion.. Pues desde acá desde Cuba eso es imposible ...
@@pepinogdev este es uno de los marcadores que tengo, la idea es agregar un buscador donde al escribir "Torre Bicentenario" el mapa se dirija al marcador pero solo encuentro información con el autocompletado, espero puedas ayudarme:) const TorreBicentenario = { lat: 23.752765, lng: -99.098718 }; const map1 = new google.maps.Map(document.getElementById("map1"), { zoom: 18, center: TorreBicentenarioi, }); const marker1 = new google.maps.Marker({ position: TorreBicentenario, map, title: "Torre Bicentenario", }); marker1.addListener("click", () => { infowindow1.open({ anchor: marker1, map1, shouldFocus: false, }); });
@@javierquinones8021 El autocompletado no tiene relacion con los marcadores que creas, por lo tanto nunca te lo va a mostrar como resultado de busqueda. Una forma de mostrar un marcador ya creado es mover el mapa a donde esta ese marcador, por lo que podrias crear un boton que diga "Mostrar torre bicentenario" que al hacerle click mueva el centro del mapa a las coordenadas deseadas, en este caso a las coordenadas de torre bicentenario.
@@pepinogdev muchas gracias por tu comentarios, me diste una perspectiva que no había notado, igual si pudieras hacer algún video en donde se puedan buscar marcadores creados seria genial, saludos.
Hola! Para obtener longitud y latitud necesitas usar la libreria place autocomplete, a partir del minuto 16:54 explico como utilizarla. Al final del video logramos acceder a place.geometry.location, ahi esta la latitud y longitud. place.geometry.location.lng y place.geometry.location.lat. Te recomiendo seguir el video completo para entender bien como utilizar el autocompletado. Cualquier cosa mandame por discord y veo si te puedo ayudar. PepinogTTV #5043
amigo una consulta habra un modo que cuando ingresas tu excel con coordenadas a My maps , se pueda crear una funcion que al seleccionar unas rutas te genere otro mapa ? saludos
Cada vez que hago una solicitud desde el lado del cliente usando Nextjs me tira problemas de CORS, sabes como puedo solucionarlo? Si tengo que configurar algo en la API, o que onda?
@@pepinogdev Ya lo pude resolver, era porque estaba haciendo una petición con axios y aparentemente no se puede. Hay que hacerlo por script si o si, sino sale el problema de CORS. Gracias por responder igualmente
Hola amigo, excelente video, tengo un problema ya hace un tiempo me sale For development purposes only y el mapa todo negro, conoces de alguna solución para este problema?
@@pepinogdev Uso mi propia key. El error me aparece en la consola pero igual funciona. Supongo que google no tiene habilitado el header "same-origin" pero como te digo, igual funciona a pesar del error en la consola. He buscado en Google sobre este error en la API Maps y no aparece nada, pareciera que así funciona esta API. ¿A tí te aparece el error en tu consola?
@@danielgarcia-je9lc Daniel a mi no me aparece ningun error, tal vez configuraste mal algo. Fijate que tengo un video de 4 minutos explicando como configurar todo perfectamente, si te funciona todo bien para practicar no creo que debas darle importancia, si necesitas ayuda podemos contactarnos por discord y verlo a detalle, saludos
Hola bro me podrias ayudar, lo que pasa es que necesito almacenar la latitud y longitud del placechange para mi tesis, pero al igual que tu al tratar de leer la propiedad geometry.location y lat o lng me devuelve una funcion en vez de un valor, tal ves sabes como leer esa funcion o como sacar esos valores ?
Excelente video, el API de google Maps es muy poderosa y comercial por su uso y facilidad, una consulta tienes algún otro video con alguna otra herramienta cómo bing, Mapbox; o tal vez una herramienta libre de geolocalización cómo ArGis, o OpenStreetMap?, gracias!
Crack me re sirvio, tengo una consulta. Ademas de buscar por direccion necesito poder marcar un punto en el mapa. No estoy logrando hacer esto o no se si se puede
Hola! Me alegro que te haya servido, deberias poder lograr eso, tienes que actualizar las coordenas del marcador y mover el mapa hacia esas mismas coordendas con setCenter, cualquier cosa hablame al discord
@@pepinogdev (antes data studio creo) similar a powe bi de ms tengo unos proyectos trazados en google earth y me los quiero llevar para ese entorno para unos informes que quiero hacer
Hola! Es una API KEY que esta pensada para estar en el navageador, cualquier puede verla. Tiene que concentrase en configurar reglas de seguridad que limiten su uso
@@pepinogdev como se restringe su uso. Si la clave API de muestra en el DOM utilizando las herramientas de inspección cualquiera lo puede copiar y usar. A lo que voy es que podrían utilizarla y el cargo de dinero por las peticiones se cargan a tu cuenta
@@ttocsomDev Ahora no recuerdo bien como limitar el uso, pero por ejemplo zonaprop, una pagina gigante del rubro inmobilirio que usa el API de google maps, puedes entrar a su web y revisar los scripts, vas a encontrar su API KEY facilmente, pero cuando intentas usarla vas a ver que no se puede, sin embargo, en su web si funciona. Tendrias que investigarlo por tu cuenta por que no recuerdo bien como se hace, pero son configuraciones que se tocan desde la consola de google cloud, puedes limitar el uso a ciertas IPS, etc, espero que te sirva la informacion.
@@pepinogdev a ver si me puedo explicar: si entras a google maps aparece un icono donde al picarle, el mapa gira para hacer coincidir la orientación del usuario en el mapa, mostrándole norte, sur, este y oeste. La cuestión es que tengo un mapa dinámico, pero cada vez que entro, el mapa se inicializa en un mismo sentido, no importa si mi teléfono apunta al norte, sur u otro, lo que hace difícil ubicarse de primera. Quizá no necesito que el mapa gire automáticamente, tan solo que el usuario pueda girar con dos dedos para leer el mapa según su necesidad. No sé si me expliqué mejor, espero que sí y que me puedas responder, cualquier cosa será de mucha ayuda, GRACIAS de antemano!
@@erikvera7394 developers.google.com/maps/documentation/javascript/webgl/tilt-rotation?hl=es-419 Creo que esto te puede ayudar a hacer lo que necesitas, cualquier duda estoy para ayudar!
Hola en el video se usa el API de google mas con JavaScript por lo tanto creo que no es posible usar este api con java, es mas el api depende bastante del HTML, por lo que tampoco se podria usar en NodeJS.
@@pcsgeeks4176 No exige https que yo sepa. Si exigiese https no podria haber grabado este video ya que en local CREO que siempre se trabja con http, en mi caso lo use sin certificado ssl sin problemas.
Tiene una capa gratuita pero es de pago, aunque si es para pruebas te puedo asegurar que nunca te van a cobrar nada, si o si tenes que configurar una cuenta de facturacion, o sea poner una tarjeta
Si lo vas a usar para aprender y probar es muy dificil que te lleguen a cobrar algo, es mas hasta podes llegar a usarlo en proyectos y no te van a cobrar a menos que se empieze a usar mucho
@@camilodinardo6365 Mira te puedo asegurar que si es para aprender y practicar imposible que te lleguen a cobrar algo, yo lo use bastante practicando y nunca me cobraron nada. Y para proyectos depende que tan usado sea, si haces algo como zonaprop claramente te van a cobrar pero si haces algo que usan un par de personas no creo. Aca podes revisar los costos: mapsplatform.google.com/intl/es/pricing/
El único que puede hacerlo sin tener que usar una tonelada de librerias con 300 lineas de codigo. Un crack!
Muchas gracias! Proximamente voy a subir mas videos de google maps para hacer cosas mas interesantes con mapas!
Estimado Simon Blanco : Eres un Maestro para Enseñar de una Forma muy Practica, Directa, sin tantas vueltas o rollos. Muchas Gracias, Saludos
Después de investigar en varios tutoriales, al fin encuentro uno que haga funcionar la API de google maps y con código sencillo. Muchas gracias
me alegra que te haya servido!!
BUAAAH ERES EL MEJOR DE VERDAD LLEVABA UN DÍA ENTERO PARA HACER LA API Y CON TU VÍDEO EN 10 minutos ya la tenía GENIIIIIO , graciiias
Locura de video locoo, y lo mas lindo es que lo hiciste mirando la documentación ahí nomas!!!! graciasss
Excelente video, me ha ayudado un monton a mi proyecto, muy bien explicados los pasos y las funciones que ofrece la libreria de manera individual para una mejor comprensión del codigo un 10, y la verdad un poco gracioso ese minuto 15:40
ajajajajaj, me alegro que el video te haya ayudado, saludos y gracias
@@pepinogdev Bro una pregunta, puedo en vez de localizar paises, que cuando busque me localice ponele restaurantes, escuelas etc.
@@taurusdark7656 Hola Taurus, sisi eso se puede hacer, tenes que aclarar en el servicio de autocompletado que queres recibir solo "establishment".
Te dejo documentacion con ejemplos.
developers.google.com/maps/documentation/javascript/place-autocomplete?hl=es-419
github.com/googlemaps/js-samples/blob/6a8598f2cbf6c57eca8c1c9b83b6629a21d34e21/dist/samples/places-autocomplete-multiple-countries/docs/index.js#L20-L37
Gracias loco! Me super ayudo ! Un genio
Muy útil y espontáneo!😄
Gracias!
Muchas gracias por compartir tus conocimientos... Lastima que obligatoriamente hay que hacer la parte de facturacion.. Pues desde acá desde Cuba eso es imposible ...
hola, quería saber si con el buscador se pueden mostrar los marcadores que hice personalmente y si te puede dirigir a los mismos. Gracias
Hola, si es posible pero no con el autcompletado. Si queres explicame como creaste los marcadores y para que los queres y tal vez puedo ayudarte
@@pepinogdev este es uno de los marcadores que tengo, la idea es agregar un buscador donde al escribir "Torre Bicentenario" el mapa se dirija al marcador pero solo encuentro información con el autocompletado, espero puedas ayudarme:)
const TorreBicentenario = { lat: 23.752765, lng: -99.098718 };
const map1 = new google.maps.Map(document.getElementById("map1"), {
zoom: 18, center: TorreBicentenarioi,
});
const marker1 = new google.maps.Marker({
position: TorreBicentenario, map, title: "Torre Bicentenario",
});
marker1.addListener("click", () => {
infowindow1.open({ anchor: marker1, map1, shouldFocus: false,
});
});
@@javierquinones8021 El autocompletado no tiene relacion con los marcadores que creas, por lo tanto nunca te lo va a mostrar como resultado de busqueda. Una forma de mostrar un marcador ya creado es mover el mapa a donde esta ese marcador, por lo que podrias crear un boton que diga "Mostrar torre bicentenario" que al hacerle click mueva el centro del mapa a las coordenadas deseadas, en este caso a las coordenadas de torre bicentenario.
@@pepinogdev muchas gracias por tu comentarios, me diste una perspectiva que no había notado, igual si pudieras hacer algún video en donde se puedan buscar marcadores creados seria genial, saludos.
Es muy bueno tu video. Te felicito capo. Me suscribo.
Muchas gracias
Alguien que me ayude a resolver si tuvo problemas con lo de facturacion plis
muchas gracias enserio no sabia como hacer esto.
Hola, como puedo hacer lo mismo usando ajax?
hola como andas? estoy intentando obtener la longitud y latitud cuando ingreso una direccion, como lo puedo decodear?
Hola! Para obtener longitud y latitud necesitas usar la libreria place autocomplete, a partir del minuto 16:54 explico como utilizarla. Al final del video logramos acceder a place.geometry.location, ahi esta la latitud y longitud. place.geometry.location.lng y place.geometry.location.lat. Te recomiendo seguir el video completo para entender bien como utilizar el autocompletado. Cualquier cosa mandame por discord y veo si te puedo ayudar. PepinogTTV
#5043
Hola bro disculpa yo tambien necesito lo de la latitud y longitud pero me retorna una funcion, como le hiciste para que poder leer esos valores?
Increíble video
excelente video crack
gracias :D
Bro, podria decirse que cuando hacerun cerco estarias usando un tipo geofence verdad?, talvez puedes hacer un video sobre ese tema geofence?
no hay cobros adicionales al agregar mi tarjeta ,verdad?
no hubo cobros?
amigo una consulta habra un modo que cuando ingresas tu excel con coordenadas a My maps , se pueda crear una funcion que al seleccionar unas rutas te genere otro mapa ? saludos
Hola!! La verdad que no tengo idea como hacer eso... Espero que puedas resolverlo, suerte
Cada vez que hago una solicitud desde el lado del cliente usando Nextjs me tira problemas de CORS, sabes como puedo solucionarlo? Si tengo que configurar algo en la API, o que onda?
Me puedes dar un ejemplo?
@@pepinogdev Ya lo pude resolver, era porque estaba haciendo una petición con axios y aparentemente no se puede. Hay que hacerlo por script si o si, sino sale el problema de CORS. Gracias por responder igualmente
Crees que hay alguna forma de usar el modo conducción de google maps en algun lenguaje?
Sí se puede con JavaScript y la API de Google Maps Directions. Preguntale a ChatGPT como implementarlo y te va decir, es bastante facil, saludos
Yo sé que este video es muy viejo pero, ¿te acordás mas o menos cuánto fue el costo del uso de la API para esas pruebas?
$0
te aseguro que use el api bastante para pruebas y nunca me cobraron nada
@@pepinogdev muchas gracias, entonces me animaré a hacer mis pruebas
Y los precios?
Estan en la pagina de google!
boa tarde Professor preciso salvar informações de latitude e longitude no banco de dados mysql (
Hola, como va? Podrías pasar una API key? Estoy tratando de registrar la tarjeta y no me está permitiendo
Hola Juan disculpa que no te respondi antes, actualmente no tengo ninguna api key para prestarte :(
Me pasa lo mismo, lo pudiste solucionar?
Hola amigo, excelente video, tengo un problema ya hace un tiempo me sale For development purposes only y el mapa todo negro, conoces de alguna solución para este problema?
te sale un codigo de error o algo? configuraste la cuenta de facturaacion?
Sale error : Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource
Si estas tratando de usar la key del video no esta funcionando mas, si no es eso, entonces podrias compartir el codigo? para que pueda ayudarte
@@pepinogdev Uso mi propia key. El error me aparece en la consola pero igual funciona. Supongo que google no tiene habilitado el header "same-origin" pero como te digo, igual funciona a pesar del error en la consola. He buscado en Google sobre este error en la API Maps y no aparece nada, pareciera que así funciona esta API. ¿A tí te aparece el error en tu consola?
@@danielgarcia-je9lc Daniel a mi no me aparece ningun error, tal vez configuraste mal algo. Fijate que tengo un video de 4 minutos explicando como configurar todo perfectamente, si te funciona todo bien para practicar no creo que debas darle importancia, si necesitas ayuda podemos contactarnos por discord y verlo a detalle, saludos
@@pepinogdev Gracias por tu ayuda. Al final era problema del adblock (Ublock). Lo desactive y desapareció el error :).
Para laravel se implementa de la misma manera?
Hola no sabria decirte, todo depende de lo que quieras hacer. Para implementarlo tenes que usar javascript.
toma tu rico like y suscribida amiguito, gracias
gracias!!!
Hola bro me podrias ayudar, lo que pasa es que necesito almacenar la latitud y longitud del placechange para mi tesis, pero al igual que tu al tratar de leer la propiedad geometry.location y lat o lng me devuelve una funcion en vez de un valor, tal ves sabes como leer esa funcion o como sacar esos valores ?
Hola Jose! Tendria ver el codigo para ayudarte
Excelente video, el API de google Maps es muy poderosa y comercial por su uso y facilidad, una consulta tienes algún otro video con alguna otra herramienta cómo bing, Mapbox; o tal vez una herramienta libre de geolocalización cómo ArGis, o OpenStreetMap?, gracias!
Hola por ahora no tengo ningun video relacionado con mapas que no sean de google maps. Saludos gracias por tu comentario
@@pepinogdev Bro una pregunta, puedo en vez de localizar paises, que cuando busque me localice ponele restaurantes, escuelas etc
Crack me re sirvio, tengo una consulta. Ademas de buscar por direccion necesito poder marcar un punto en el mapa. No estoy logrando hacer esto o no se si se puede
Hola! Me alegro que te haya servido, deberias poder lograr eso, tienes que actualizar las coordenas del marcador y mover el mapa hacia esas mismas coordendas con setCenter, cualquier cosa hablame al discord
Me pide los datos de la tarjeta para la API, hubiese sido bueno que especificara eso.
7:10 ahi lo dije...
sos el 1
gracias marcos
Hola, tienes experiencia en looker studio y mapas que me puedas apoyar
Hola, no se que es looker studio :(
@@pepinogdev (antes data studio creo) similar a powe bi de ms tengo unos proyectos trazados en google earth y me los quiero llevar para ese entorno para unos informes que quiero hacer
Sabrá cómo ocultar la API key para que no se muestre en el navegador. Ya que está puesta en el index.html.saludos
Hola! Es una API KEY que esta pensada para estar en el navageador, cualquier puede verla. Tiene que concentrase en configurar reglas de seguridad que limiten su uso
@@pepinogdev como se restringe su uso. Si la clave API de muestra en el DOM utilizando las herramientas de inspección cualquiera lo puede copiar y usar. A lo que voy es que podrían utilizarla y el cargo de dinero por las peticiones se cargan a tu cuenta
@@ttocsomDev Ahora no recuerdo bien como limitar el uso, pero por ejemplo zonaprop, una pagina gigante del rubro inmobilirio que usa el API de google maps, puedes entrar a su web y revisar los scripts, vas a encontrar su API KEY facilmente, pero cuando intentas usarla vas a ver que no se puede, sin embargo, en su web si funciona. Tendrias que investigarlo por tu cuenta por que no recuerdo bien como se hace, pero son configuraciones que se tocan desde la consola de google cloud, puedes limitar el uso a ciertas IPS, etc, espero que te sirva la informacion.
He estado buscando información sobre cómo rotar el mapa de acuerdo a la posición del usuario, si alguien tiene algún dato se los agradecería mucho!
Hola Erik, no entiendo muy bien a que te referis con rotar el mapa de acuerdo a la posicion del usuario. Si me explicas tal vez te puedo ayudar :D
@@pepinogdev a ver si me puedo explicar: si entras a google maps aparece un icono donde al picarle, el mapa gira para hacer coincidir la orientación del usuario en el mapa, mostrándole norte, sur, este y oeste.
La cuestión es que tengo un mapa dinámico, pero cada vez que entro, el mapa se inicializa en un mismo sentido, no importa si mi teléfono apunta al norte, sur u otro, lo que hace difícil ubicarse de primera.
Quizá no necesito que el mapa gire automáticamente, tan solo que el usuario pueda girar con dos dedos para leer el mapa según su necesidad.
No sé si me expliqué mejor, espero que sí y que me puedas responder, cualquier cosa será de mucha ayuda, GRACIAS de antemano!
@@erikvera7394 developers.google.com/maps/documentation/javascript/webgl/tilt-rotation?hl=es-419 Creo que esto te puede ayudar a hacer lo que necesitas, cualquier duda estoy para ayudar!
Hola, tenes idea de como implementar esto con JAVA ?
Hola en el video se usa el API de google mas con JavaScript por lo tanto creo que no es posible usar este api con java, es mas el api depende bastante del HTML, por lo que tampoco se podria usar en NodeJS.
Es Forzoso, tener HTTPS?
Hola no entiendo muy bien a que te refirs, si podes ser mas espesifico tal vez te puedo ayudar :D
@@pepinogdev si el uso de la API, No tiene problemas al usarlo en desarrollo.con HTTP o exige SSL HTTPS ?? En tu video lo usas modo LOCAL.
@@pcsgeeks4176 No exige https que yo sepa. Si exigiese https no podria haber grabado este video ya que en local CREO que siempre se trabja con http, en mi caso lo use sin certificado ssl sin problemas.
Una pregunta eso se paga o es gratis
Tiene una capa gratuita pero es de pago, aunque si es para pruebas te puedo asegurar que nunca te van a cobrar nada, si o si tenes que configurar una cuenta de facturacion, o sea poner una tarjeta
Gracias, aunque te falto la segunda parte
Miguel gracias por tu comentario! En estos dias voy a subir la segunda parte y otras cosas interesantes que se pueden hacer con google maps :D
Tenes una cuenta de paga bro?? Porque al querer habilitar me pide una tarjeta :/
la unica forma de usar es poniendo la tarjeta... pero no te cobran nada a menos que la uses con miles de usuarios :(
es una pena que no sea gratis.. tenes que poner la tarjeta y no quiero que me cobren XD
Si lo vas a usar para aprender y probar es muy dificil que te lleguen a cobrar algo, es mas hasta podes llegar a usarlo en proyectos y no te van a cobrar a menos que se empieze a usar mucho
@@pepinogdev lo usaste en proyectos ya? porque me da cosa la verdad.. el tema de meter tarjetas es sensible
@@pepinogdev es justamente para aprender y practicar, meterlo en algun que otro proyecto tal ves
@@camilodinardo6365 Mira te puedo asegurar que si es para aprender y practicar imposible que te lleguen a cobrar algo, yo lo use bastante practicando y nunca me cobraron nada. Y para proyectos depende que tan usado sea, si haces algo como zonaprop claramente te van a cobrar pero si haces algo que usan un par de personas no creo.
Aca podes revisar los costos: mapsplatform.google.com/intl/es/pricing/
Yo no tengo tarjeta ¿Cómo le hago ahí?