Guías

Añade una calculadora de distancia a la tienda en una landing page

"A qué distancia está vuestra ubicación más cercana" es una pregunta que una landing page puede responder directamente, en lugar de mandar al visitante a un mapa aparte para que lo averigüe por su cuenta.

Geocodificar lo que escribe el visitante

Toma la dirección o el código postal que el visitante escriba en un campo de formulario sencillo y geocodifícalo.

GET /v1/forward?q=350 Fifth Avenue, New York&limit=1
{
  "status": "ok",
  "results": [
    {"formatted": "350 Fifth Avenue, New York, NY", "lat": 40.7484, "lon": -73.9857, "type": "address", "precision": "house", "confidence": 0.96, "place_id": "es234", "components": {}}
  ]
}

Calcular la distancia a cada tienda

Con las coordenadas del visitante en la mano, calcula la distancia en línea recta desde ese punto hasta cada una de tus tiendas, que guardas como una lista fija de coordenadas en tu propio código, usando la fórmula haversine estándar.

for store in stores:
    store.distance_km = haversine(store.lat, store.lon, 40.7484, -73.9857)

Mostrar el resultado

Ordena tu lista de tiendas por la distancia calculada y muestra la más cercana, o las más cercanas, junto con la cifra de distancia. Como todo se ejecuta en el servidor al enviar el formulario, no hace falta ningún script en el cliente: la página simplemente muestra el resultado en la siguiente carga.

Un segundo ejemplo: mostrar las tres más cercanas en lugar de una

En lugar de indicar solo la tienda más cercana, ordenar la lista completa y mostrar las tres primeras le da al visitante una elección real, algo especialmente útil cuando la tienda más cercana puede tener otro horario u otras existencias que una algo más lejana que el visitante preferiría. No cuesta nada extra, ya que la ordenación se hace sobre las mismas coordenadas de la misma única solicitud.

Gestionar una coincidencia de baja confianza

Si la dirección que escribió el visitante vuelve con una puntuación de confianza baja, muéstrale el resultado formateado para que lo confirme antes de calcular la distancia, en lugar de indicar con seguridad una distancia basada en una suposición sobre lo que quiso decir.

Un error habitual que debes evitar

No hagas el cálculo de distancia sobre una consulta que se resolvió con una precisión mucho más gruesa de la que probablemente pretendía el visitante, como un simple nombre de ciudad o región que coincide con un resultado de tipo "locality", sin avisar antes al visitante. Una distancia calculada desde el centro de una ciudad en lugar de la calle real del visitante puede desviarse varios kilómetros en cualquier dirección, lo suficiente para cambiar qué tienda parece la más cercana. Comprobar el campo de precisión antes de dar una cifra de distancia que suena segura evita presentar una estimación aproximada como si fuera exacta.

Dejar que el visitante elija entre coincidencias ambiguas

Subir limit por encima de 1 en la solicitud de geocodificación devuelve varias coincidencias candidatas cuando el texto escrito es realmente ambiguo, como un nombre de calle que existe en más de una localidad. Mostrar esa lista corta y dejar que el visitante elija la correcta antes de calcular la distancia da un resultado mejor que quedarse en silencio con el candidato que por casualidad quedó primero.

Lo que cuesta

Cada cálculo es una solicitud de geocodificación, sin importar con cuántas tiendas compares las coordenadas resultantes, ya que la lista de tiendas no requiere más llamadas a la API una vez que tienes las coordenadas del visitante. Una landing page con un tráfico considerable sigue usando esta función a razón de una solicitud por cálculo de cada visitante, muy dentro de las 2.500 solicitudes gratuitas al día incluidas con cada clave.

Una calculadora de distancia como esta responde a una pregunta concreta y habitual directamente en la página, en lugar de mandar al visitante a otro sitio para averiguarlo. Los parámetros completos de la solicitud están en la documentación de geocodificación directa.