En el artículo de hoy te enseñaré a calcular la distancia en kilómetros que existe entre 2 puntos geográficos o 2 coordenadas, tomando las longitudes y latitudes.
Básicamente vamos a saber cuál es la medida que separa ambos puntos obtenidos con el GPS usando la fórmula de Haversine en JavaScript, y esto nos funcionará en el navegador así como en Node.js.
Con esto podríamos ordenar los lugares cercanos dependiendo de la ubicación del usuario, por ejemplo.
Lo que tenemos que hacer es implementar la fórmula. Yo la voy a encerrar dentro de una función para que sea reutilizable.
Además de la función en sí, necesitaremos otra función que convierta grados a radianes. Comencemos viendo esa función:
const gradosARadianes = (grados) => {
return grados * Math.PI / 180;
};
Básicamente es multiplicar los grados por Pi y luego dividir eso entre 180.
Eso es necesario porque las coordenadas están expresadas en grados y nosotros las necesitamos como radianes al usarlas con la fórmula de Haversine y calcular la distancia entre 2 puntos de la tierra con JavaScript.
Ahora que ya tenemos la conversión de grados a radianes veamos la fórmula que recibe ambas latitudes y longitudes:
const calcularDistanciaEntreDosCoordenadas = (lat1, lon1, lat2, lon2) => {
// Convertir todas las coordenadas a radianes
lat1 = gradosARadianes(lat1);
lon1 = gradosARadianes(lon1);
lat2 = gradosARadianes(lat2);
lon2 = gradosARadianes(lon2);
// Aplicar fórmula
const RADIO_TIERRA_EN_KILOMETROS = 6371;
let diferenciaEntreLongitudes = (lon2 - lon1);
let diferenciaEntreLatitudes = (lat2 - lat1);
let a = Math.pow(Math.sin(diferenciaEntreLatitudes / 2.0), 2) + Math.cos(lat1) * Math.cos(lat2) * Math.pow(Math.sin(diferenciaEntreLongitudes / 2.0), 2);
let c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
return RADIO_TIERRA_EN_KILOMETROS * c;
};
Recuerda que la función devolverá la distancia entre 2 coordenadas expresada en kilómetros, y a partir de ello puedes convertirla a metros, pies, millas, etcétera.
Veamos un ejemplo para sacar la distancia entre la Ciudad de México y La Habana, lo hago de este modo porque en Google Maps se puede medir la distancia y obtener las coordenadas, así comprobamos que la función que calcula diferencia entre coordenadas con JavaScript funciona.
const calcularDistanciaEntreDosCoordenadas = (lat1, lon1, lat2, lon2) => {
// Convertir todas las coordenadas a radianes
lat1 = gradosARadianes(lat1);
lon1 = gradosARadianes(lon1);
lat2 = gradosARadianes(lat2);
lon2 = gradosARadianes(lon2);
// Aplicar fórmula
const RADIO_TIERRA_EN_KILOMETROS = 6371;
let diferenciaEntreLongitudes = (lon2 - lon1);
let diferenciaEntreLatitudes = (lat2 - lat1);
let a = Math.pow(Math.sin(diferenciaEntreLatitudes / 2.0), 2) + Math.cos(lat1) * Math.cos(lat2) * Math.pow(Math.sin(diferenciaEntreLongitudes / 2.0), 2);
let c = 2 * Math.atan2(Math.sqrt(a), Math.sqrt(1 - a));
return RADIO_TIERRA_EN_KILOMETROS * c;
};
const gradosARadianes = (grados) => {
return grados * Math.PI / 180;
};
//CDMX
//19.416326917410476, -99.12479042256915
const cdmx = {
latitud: 19.416326917410476,
longitud: -99.12479042256915,
};
// La habana
// 23.097069089850933, -82.35006433419622
const habana = {
latitud: 23.097069089850933,
longitud: -82.35006433419622,
};
const distanciaEnKilometros = calcularDistanciaEntreDosCoordenadas(cdmx.latitud, cdmx.longitud, habana.latitud, habana.longitud);
console.log(distanciaEnKilometros);
Al ejecutar el script (ya mencioné que también funciona en el navegador) aparece lo siguiente:
Como puedes ver, ambas mediciones coinciden. Así de sencillo es medir la distancia entre 2 coordenadas con JS.
A partir de esto ya podemos hacer varias cosas como indicar al usuario los lugares cercanos, usar OpenLayers para seleccionar 2 puntos y medir la distancia, mostrar la distancia en tiempo real y muchas cosas más.
Nota: esto calcula la distancia usando una línea recta (que no es recta porque la tierra no es plana, es por eso que se usa Haversine y no la que calcula la distancia entre 2 puntos de un plano) y no toma en cuenta las calles, montañas y cosas de esas.
Nota 2: esto ya lo hice con C y solo estoy portando la fórmula a JS.
Para terminar te dejo con más tutoriales de JavaScript en mi blog.
Ya te enseñé cómo convertir una aplicación web de Vue 3 en una PWA. Al…
En este artículo voy a documentar la arquitectura que yo utilizo al trabajar con WebAssembly…
En un artículo anterior te enseñé a crear un PWA. Al final, cualquier aplicación que…
Al usar Comlink para trabajar con los workers usando JavaScript me han aparecido algunos errores…
En este artículo te voy a enseñar cómo usar un "top level await" esperando a…
Ayer estaba editando unos archivos que son servidos con el servidor Apache y al visitarlos…
Esta web usa cookies.
Ver comentarios
Muchas gracias, me fue de ayuda