0

Tengo un problema con la api de google maps con la geolocalización. quiero hacer funcionar un botón que dice "Ubicación actual" y me de mi dirección actual. estoy utilizando javascript puro, lo que no logre hacer es hacer funcionar la etiqueta button en javascript intente de todas formas pero no logro encontrar la correcta.

 // geolocation.
        if (navigator.geolocation) {
          navigator.geolocation.getCurrentPosition(function(position) {
            var pos = {
              lat: position.coords.latitude,
              lng: position.coords.longitude
            };

            infoWindow.setPosition(pos);
            infoWindow.setContent('Tu ubicacion');
            infoWindow.open(map);
            map.setCenter(pos);
          }, function() {
            handleLocationError(true, infoWindow, map.getCenter());
          });
        } else {
          // Browser doesn't support Geolocation
          handleLocationError(false, infoWindow, map.getCenter());
        }

            infoWindow = new google.maps.InfoWindow;

    // geolocation.
    if (navigator.geolocation) {
      navigator.geolocation.getCurrentPosition(function(position) {
        var pos = {
          lat: position.coords.latitude,
          lng: position.coords.longitude
        };

        infoWindow.setPosition(pos);
        infoWindow.setContent('Tu ubicacion');
        infoWindow.open(map);
        map.setCenter(pos);
      }, function() {
        handleLocationError(true, infoWindow, map.getCenter());
      });
    } else {
      // Browser doesn't support Geolocation
      handleLocationError(false, infoWindow, map.getCenter());
    }

    function handleLocationError(browserHasGeolocation, infoWindow, pos) {
      infoWindow.setPosition(pos);
      infoWindow.setContent(browserHasGeolocation ?
                            'Error: El servicio de Geolocalizacón ha fallado' :
                            'Error: Su navegador no admite Geolocalización.');
      infoWindow.open(map);
    }
  }
      }
  <button onclick="getLocation()">Ubicación actual</button>
  <div id="map"></div>

1
  • 1
    Hola hace falta algo más de información. Hay algunas restricciones de seguridad que puedes estar ignorando. Tu código no permite percibirlo. Si no lo has hecho antes mira Geolocation API
    – quevedo
    el 23 feb. 2020 a las 3:41

1 respuesta 1

1

te agrego un código con el que detectar si puedes o no acceder desde tu código a la localización.

Desde esta web sale acceso denegado, sin embargo si descargas el código en local, puedes ver que te saltará la ventana de tu navegador, preguntándote si "permites el acceso", si le das okey, entonces obtendrás tu localización por coordenadas

En este punto y con este código puedes detectar si estás o no accediendo adecuadamente. Si te da "acces denied", justo en ese punto entonces es que tienes bloqueados los "popup" de acceso de tu navegador. Si los tienes activos, te saltará y te permitirá decidir si le das o no acceso.

Piensa que al tratarse de algo "tan personal" como el posicionamiento, existen restricciones, tales como mínimo preguntar al usuario si le permites o no dar esa información.

Si consigues obtener la localización, con las coordenadas puedes introducirlas en la petición de tu API, y entonces obtener el mapa que deseas

Espero que te ayude y sea suficiente, saludos! ;)

<!DOCTYPE HTML>
<html>
<head>
  <script type="text/javascript">
    const APIKEY = null;
    function showLocation(position) {
      const {latitude, longitude} = position.coords;
      const latlongvalue = `${latitude},${longitude}`;
      alert(`Tu geolocalización es ${latlongvalue}`);
    }
    function errorHandler(err) {
      if(err.code == 1) {
        alert("Error: Access is denied!");
      } else if( err.code == 2) {
        alert("Error: Position is unavailable!");
      }
    }
    function getLocation(){
      if(navigator.geolocation){
        // timeout at 60000 milliseconds (60 seconds)
        var options = {timeout:60000};
        navigator.geolocation.getCurrentPosition
        (showLocation, errorHandler, options);
      } else{
        alert("Sorry, browser does not support geolocation!");
      }
    }
  </script>
</head>
<body>
<div id="mapholder"></div>
<form>
  <input type="button" onclick="getLocation();" value="Get Location"/>
</form>
</body>
</html>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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