#php obtener coordenadas introduciendo direccion en google map api v3 by @miguelperezsubi

Fuente: miguelperezsubias.aui.es

Ejemplos de uso Google Maps V3

Cada vez son más las aplicaciones que requieren utilizar funciones relacionadas con la geolocalización bien para posicionar un punto o una dirección en un mapa o bien para obtener sus coordenadas, calcular distancias, dibujar caminos, …..

Google acaba de lanzar la V3 de su API (Application Interface) que facilita, a través de su librería en javascript, la integración de mapas en páginas web, API que esta bien documentada en su web oficial donde también encontraras una buena batería de ejemplos que pueden ayudarte a entender las funciones básicas.

Me he propuesto aprender más sobre como utilizar la V3 de Google Maps y para ello he desarrollado y documentado estos ejemplos prácticos:

  • Posicionar un marcador en el mapa por coordenadas, dirección y obtener estos datos si lo sitúo en un punto diferente del mapa.
  • Dibujar una polilínea (polyline), escribir etiquetas y personalizar los iconos de los marcadores
POSICIONAR UN MARCADOR EN EL MAPA

Es habitual necesitar las coordenadas de un punto (longitud, latitud, dirección postal) en un mapa bien porque queremos localizarlo el punto en el mapa a partir de su dirección o coordenadas o lo contrario obtener los datos de un punto, coordenadas y direccion, que situó en el mapa.

El primer ejemplo se ocupa de esto, le he dado el nombre de mapas_marcador.php

Ver demo -//- Ver código fuenteParámetros de llamada

En la llamada se le pueden pasar opcionalmente hasta cuatro parámetros en la llamada que nos van a permitir:

Situar el marcador en el mapa. Admite dos posibilidades:

a) lat, lon: darle las coordenadas latitud y longitud

b) dir: darle la dirección (codificada con urlencode)

Si se especifican ambos, la dirección prevalece sobre las coordenadas.

Especificar el zoom y el tipo de mapa:

c) zoom: nivel de zoom (1,19)

d) tipo: tipo de mapa a utilizar (ROADMAP, SATELLITE, HYBRID o TERRAIN)

Ejemplo de llamada:

mapas_marcador.php?lat=41.4235720334046&lon=-0.4985787200928371&zoom=15

mapas_marcador.php?dir=segovia,spain&zoom=15&tipo=ROADMAP

En el mapa

Una vez en el mapa el marcador que señala el punto se puede mover arrastrandolo(drag&drop) o bien haciendo click en otro punto del mapa en cuyo caso el nuevo marcador sustituirá al anterior. En todo momento en las cajas de texto se decodifica la dirección y las coordenadas (latitud y longitud) del punto.

También incorpora el mapa los controles clásicos del Google Maps para hacer zoom, mover el mapa o cambiar el tipo de mapa.

Geo-Localizar direcciones o coordenadas desde el formulario

En la parte superior del mapa tenemos tres campos editables: Dir, Lat y Lon correspondientes a la Dirección, Latitud y Longitud cuyos valores se actualizan dinámicamente al mover el marcador.

También pueden utilizarse para escribir en estos campos unos valores y geolocalizar el marcador correspondiente en el mapa a partir de la Dirección (Botón Geo-Dir) o bien a partir de las coordenadas (Geo-LatLon) escritas previamente en las cajas de texto.

En este caso el nuevo marcador se situa en el centro del mapa sin modificar el nivel de zoom.

Procesar los datos del marcador

El botón Procesar permite llamar a la función mapas_marcador_procesar.php pasándole como parámetro los valores que hay en las cajas de texto (Dir, Lon y Lat) a través de variables de formulario ($_POST) con los nombres (longitud/latitud/direccion .

En este caso simplemente hacemos eco de las mismas ($_POST[“longitud”],$_POST[“latitud”] y $_POST[“direccion”]) para mostrarlas en pantalla.

POLILINEAS, MARCADORES PERSONALIZADOS y ETIQUETAS

En este caso el ejercicio que he resuelto es el siguiente:

Posicionar tres marcadores en un mapa, a partir de sus coordenadas, cuyo zoom se ajusta para que todas quepan en el tamaño de mapa elegido.

Personalizar los marcadores cada uno con un icono diferente.

Unir los marcadores por una polilinea (polyline)

Que todos los marcadores se puedan arrastrar y cambiar de posición.

Situar el marcador central en la posición del mapa donde haga click con el ratón

Al mover cualquiera de los marcadores imprimo en su base la distancia total entre ellos, en el primero, y la distancia con el otro en el segundo y tercer marcador respectivamente.

Y este es el resultado que esta bien comentado para los que quieran analizar como lo he resuelto.

Ver demo -//- Ver código fuenteEspero que te sea útil y seguiré añadiendo nuevos ejemplos.

Anuncios

8 comentarios sobre “#php obtener coordenadas introduciendo direccion en google map api v3 by @miguelperezsubi

    1. muchas gracias a ti por tus palabras, es agradable descubrir que este blog le sirve de ayuda a alguien mas que a mi (que lo uso de baul de los recuerdos porque mi memoria ya … jejejeje)

      un saludo

  1. Disculpa, he validado su ejemplode mapas_marcador, pero podrias ser mas explicito como lo podria yo utilizar y correr en un pc. Como debo aplicar el programa fuente que tienes?
    Muchas gracias,

    1. buenas, tu pregunta me parece muy generica … para hacer funcionar esto en un pc necesitas un servidor local de php

      la integracion es la misma que en un servidor web

      espero haberte sido de ayuda xDD

  2. buenas noches, desde colombia, priemro felicitacione spor el post, muy bueno, mi pregunta es la siguiente como hago para validar un poligono en el mapa es decir que si sea la direccion correcta y no una falsa que el usuario agrega, gracias de nuevo, y bueno soy muy pero muy nuevo en la programacion pero con ganas de aprender

  3. Esta página no ha cargado Google Maps correctamente. Descubre los detalles técnicos del problema en la consola de JavaScript.

    sale eso :/

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s