0

Muy buenas tardes, necesito saber si hay alguna forma se colocar la información que hay en el input y con el boton, lo redirija google maps con esa información y busque el resultado.

foto

Ya se que google maps tiene las api, y las he investigado, pero no entiendo como implementarlas a lo que yo necesito, el más cercano que encontré fue el places, pero aun así no lo entiendo A continuacion les muestro o que tengo en codigo de esa foto

                    <div class="row form-group">
                    <label class="col-form-label col-md-4">Direccion:</label>
                    <div class="col-9">
                        <input type="text" name="" value="" id="direccionEditar" class="form-control" readonly>  
                    </div>

                    <a type="button" class="btn btn-warning fas fa-plane" href="https://www.google.cl/maps/preview" target="_blank"></a>
                </div>

No quiero implementar el mapa de google dentro del php, lo que quiero por ejemplo es que al tocar el boton, se abra una pestaña aparte con target:"_blank" y que se abra google maps, en el ejemplo anterior, tendria que redirigir a algo así:

https://www.google.cl/maps/place/Av.+Vicuña+Mackenna+1231

Muchas gracias!

3
  • según los tags que colocaste, lo que quieres es implementar mapas a través de PHP? el 18 nov. 2019 a las 15:11
  • No quiero implementar el mapa de google dentro del php, lo que quiero por ejemplo es que al tocar el boton, se abra una pestaña aparte con target:"_blank" y que se abra google maps, en el ejemplo anterior, tendria que redirigir a algo así: www.google.cl/maps/place/Av.+Vicuña+Mackenna+1231 el 18 nov. 2019 a las 15:26
  • Si quieres mostrar siempre la misma dirección, es simple, solo debes incorporar el mapa dentro de un nuevo template. Pero si lo que quieres es poder buscar direcciones a través de tu página y que te muestre el resultado en otra pestaña, necesitarás varias cosas: Primero, un framework que te permita consumir el api de google maps, google maps trabaja con coordenadas, así que necesitarás una dependencia que transforme tu dirección en latitud y longitud, y ya con eso puedes usar el template que te entrega google para implementar el mapa usando los parámetros que te entregue la dependencia. el 18 nov. 2019 a las 15:52

1 respuesta 1

1

Te pongo esta solución.

Primero asignar un evento al botón de consultar.

    <a onclick="return mostrarLugar();" type="button" class="btn btn-warning fas fa-plane" href="https://www.google.cl/maps/preview" target="_blank"></a>

Despues obtienes el valor y simplemente abres una nueva pestaña con el método open que esta en el objeto window

Dicho esto tu código se vería así.

HTML:

<div class="row form-group">
    <label class="col-form-label col-md-4">Direccion:</label>
    <div class="col-9">
        <input type="text" name="" value="Av.Vicuña Mackenna 1231" id="direccionEditar" class="form-control" readonly>
    </div>

    <a onclick="return mostrarLugar();" 

    type="button" class="btn btn-warning fas fa-plane" 

    href="https://www.google.cl/maps/preview" target="_blank">Consultar</a>
</div>

JS:

function mostrarLugar(){
  let item = document.getElementById('direccionEditar')
  if(item){
    window.open('https://google.cl/maps/place/'+item.value, '_blank');
  }  
  return false; //No ejecutar el evento.
}

Tu Respuesta

Al pulsar en “Publica tu respuesta”, muestras tu consentimiento a nuestros términos de servicio, política de privacidad y política de cookies

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.