javascript - w3schools - Geolocalización ubicación más cercana(lat, long) desde mi posición

sse html 5

Question

Quiero mostrar información específica dependiendo de donde estoy.

Tengo cinco ciudades con información diferente y quiero mostrar la ciudad (información) a la que estoy más cerca.

Cómo hacerlo de la manera más sencilla, utilizando javascript.

Ex.

Si almaceno las ciudades lat, long en un array

var cities = [
  [''new york'', ''111111'', ''222222'', ''blablabla'']
  [''boston'', ''111111'', ''222222'', ''blablabla'']
  [''seattle'', ''111111'', ''222222'', ''blablabla'']
  [''london'', ''111111'', ''222222'', ''blablabla'']
]

Y con mi ubicación actual (lat, long) quiero la ciudad en la que estoy más cerca.

Answer 1

Con HTML5, puede extraer la ubicación del usuario y luego comparar este ejemplo utilizando una función de Haversine ( función que se muestra a continuación ):

function getDistanceFromLatLonInKm(lat1,lon1,lat2,lon2) {
  var R = 6371; // Radius of the earth in km
  var dLat = deg2rad(lat2-lat1);  // deg2rad below
  var dLon = deg2rad(lon2-lon1); 
  var a = 
    Math.sin(dLat/2) * Math.sin(dLat/2) +
    Math.cos(deg2rad(lat1)) * Math.cos(deg2rad(lat2)) * 
    Math.sin(dLon/2) * Math.sin(dLon/2)
    ; 
  var c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1-a)); 
  var d = R * c; // Distance in km
  return d;
}

function deg2rad(deg) {
  return deg * (Math.PI/180)
}

Answer 2

Este es un ejemplo de código básico que utiliza la geolocalización HTML5 para obtener la posición del usuario. Luego llama a NearestCity() y calcula la distancia (km) desde la ubicación a cada ciudad. Pasé a usar las fórmulas de Haversine y en su lugar usé las fórmulas de Pitágoras más simples y una proyección equirectangular para ajustar la curvatura en las líneas de longitud.

// Get User''s Coordinate from their Browser
window.onload = function() {
  // HTML5/W3C Geolocation
  if (navigator.geolocation) {
    navigator.geolocation.getCurrentPosition(UserLocation);
  }
  // Default to Washington, DC
  else
    NearestCity(38.8951, -77.0367);
}

// Callback function for asynchronous call to HTML5 geolocation
function UserLocation(position) {
  NearestCity(position.coords.latitude, position.coords.longitude);
}


// Convert Degress to Radians
function Deg2Rad(deg) {
  return deg * Math.PI / 180;
}

function PythagorasEquirectangular(lat1, lon1, lat2, lon2) {
  lat1 = Deg2Rad(lat1);
  lat2 = Deg2Rad(lat2);
  lon1 = Deg2Rad(lon1);
  lon2 = Deg2Rad(lon2);
  var R = 6371; // km
  var x = (lon2 - lon1) * Math.cos((lat1 + lat2) / 2);
  var y = (lat2 - lat1);
  var d = Math.sqrt(x * x + y * y) * R;
  return d;
}

var lat = 20; // user''s latitude
var lon = 40; // user''s longitude

var cities = [
  ["city1", 10, 50, "blah"],
  ["city2", 40, 60, "blah"],
  ["city3", 25, 10, "blah"],
  ["city4", 5, 80, "blah"]
];

function NearestCity(latitude, longitude) {
  var mindif = 99999;
  var closest;

  for (index = 0; index < cities.length; ++index) {
    var dif = PythagorasEquirectangular(latitude, longitude, cities[index][1], cities[index][2]);
    if (dif < mindif) {
      closest = index;
      mindif = dif;
    }
  }

  // echo the nearest city
  alert(cities[closest]);
}

Answer 3

Puede calcular la distancia por latitud con su ubicación y las ubicaciones de las ciudades. Y encuentra el más corto y dibuja. Para calcular puede leer más en http://www.movable-type.co.uk/scripts/latlong.html