freeCodeCamp/curriculum/challenges/spanish/04-data-visualization/json-apis-and-ajax/get-geolocation-data-to-fin...

3.3 KiB

id title challengeType videoUrl localeTitle
587d7faf367417b2b2512be8 Get Geolocation Data to Find A User's GPS Coordinates 6 Obtenga datos de geolocalización para encontrar las coordenadas GPS de un usuario

Description

Otra cosa interesante que puedes hacer es acceder a la ubicación actual de tu usuario. Cada navegador tiene un navegador incorporado que puede proporcionarle esta información. El navegador obtendrá la longitud y latitud actual del usuario. Verá un aviso para permitir o bloquear este sitio para que no sepa su ubicación actual. El desafío se puede completar de cualquier manera, siempre que el código sea correcto. Al seleccionar Permitir, verá que el texto en el teléfono de salida cambia a su latitud y longitud. Aquí está el código que hace esto:
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition (función (posición) {
document.getElementById ('data'). innerHTML = "latitude:" + position.coords.latitude + "<br> longitude:" + position.coords.longitude;
});
}
Primero, verifica si el objeto navigator.geolocation existe. Si lo hace, se getCurrentPosition método getCurrentPosition en ese objeto, que inicia una solicitud asíncrona para la posición del usuario. Si la solicitud es exitosa, la función de devolución de llamada en el método se ejecuta. Esta función accede a los valores del objeto de position para latitud y longitud usando notación de puntos y actualiza el HTML.

Instructions

Agregue el código de ejemplo dentro de las etiquetas de script para verificar la ubicación actual de un usuario e insértelo en el HTML.

Tests

tests:
  - text: Su código debe usar <code>navigator.geolocation</code> para acceder a la ubicación actual del usuario.
    testString: 'assert(code.match(/navigator\.geolocation\.getCurrentPosition/g), "Your code should use <code>navigator.geolocation</code> to access the user&#39;s current location.");'
  - text: Su código debe usar <code>position.coords.latitude</code> para mostrar la ubicación latitudinal del usuario.
    testString: 'assert(code.match(/position\.coords\.latitude/g), "Your code should use <code>position.coords.latitude</code> to display the user&#39;s latitudinal location.");'
  - text: Su código debe usar <code>position.coords.longitude</code> para mostrar la ubicación longitudinal del usuario.
    testString: 'assert(code.match(/position\.coords\.longitude/g), "Your code should use <code>position.coords.longitude</code> to display the user&#39;s longitudinal location.");'
  - text: Debería mostrar la posición del usuario dentro del elemento div de <code>data</code> .
    testString: 'assert(code.match(/document\.getElementById\(\s*?("|")data\1\s*?\)\.innerHTML/g), "You should display the user&#39;s position within the <code>data</code> div element.");'

Challenge Seed

<script>
  // Add your code below this line


  // Add your code above this line
</script>
<h4>You are here:</h4>
<div id="data">

</div>

Solution

// solution required