Convertir Lat / Longs a coordenadas X / Y

StackOverflow https://stackoverflow.com/questions/1019997

Pregunta

Tengo el valor Lat / Long de la ciudad de Nueva York, NY; 40.7560540, -73.9869510 y una imagen plana de la tierra, 1000 px & # 215; 446px.

Me gustaría poder convertir, usando Javascript, la coordenada Lat / Long a X, Y donde el punto reflejaría la ubicación.

Entonces, la coordenada X, Y de la esquina superior izquierda de la imagen sería; 289, 111

Cosas a tener en cuenta:

  1. no te preocupes por los problemas de qué proyección usar, haz tu propio suposición o ir con lo que sabes podría funcionar
  2. X, Y se puede formar en cualquier esquina de la imagen
  3. Puntos de bonificación por la misma solución en PHP (pero yo realmente necesito el JS)
¿Fue útil?

Solución

Una función de conversión básica en js sería: 

MAP_WIDTH = 1000;
MAP_HEIGHT = 446;

function convert(lat, lon){
    var y = ((-1 * lat) + 90) * (MAP_HEIGHT / 180);
    var x = (lon + 180) * (MAP_WIDTH / 360);
    return {x:x,y:y};
}

Esto devolverá el número de píxeles desde la esquina superior izquierda. Esta función asume lo siguiente:

  1. Que su imagen está correctamente alineada con la esquina superior izquierda (0,0) alineándose con 90 * Norte por 180 * Oeste.
  2. Que sus coordenadas están firmadas con N siendo -, S siendo +, W siendo - y E siendo +

Otros consejos

La proyección que usa va a cambiar todo, pero esto funcionará asumiendo una proyección de Mercator: 

<html>
<head>
<script language="Javascript">
var dot_size = 3;
var longitude_shift = 55;   // number of pixels your map's prime meridian is off-center.
var x_pos = 54;
var y_pos = 19;
var map_width = 430;
var map_height = 332;
var half_dot = Math.floor(dot_size / 2);
function draw_point(x, y) {
    dot = '<div style="position:absolute;width:' + dot_size + 'px;height:' + dot_size + 'px;top:' + y + 'px;left:' + x + 'px;background:#00ff00"></div>';
    document.body.innerHTML += dot;
}
function plot_point(lat, lng) {
    // Mercator projection

    // longitude: just scale and shift
    x = (map_width * (180 + lng) / 360) % map_width + longitude_shift;

    // latitude: using the Mercator projection
    lat = lat * Math.PI / 180;  // convert from degrees to radians
    y = Math.log(Math.tan((lat/2) + (Math.PI/4)));  // do the Mercator projection (w/ equator of 2pi units)
    y = (map_height / 2) - (map_width * y / (2 * Math.PI)) + y_pos;   // fit it to our map

    x -= x_pos;
    y -= y_pos;

    draw_point(x - half_dot, y - half_dot);
}
</script>
</head>
<body onload="plot_point(40.756, -73.986)">
    <!-- image found at http://www.math.ubc.ca/~israel/m103/mercator.png -->
    <img src="mercator.png" style="position:absolute;top:0px;left:0px">
</body>
</html>

Hay una buena biblioteca Javascript, PROJ4JS , que le permite hacer transformaciones entre diferentes proyecciones.

Si tiene una imagen de toda la tierra, la proyección siempre importa. Pero tal vez no entiendo tu pregunta.

He escrito una función que funciona para los mapas de Mercator. Especialmente si su imagen no cubre todo el mundo, significa que también funciona con mapas recortados: https://stackoverflow.com/a/ 10401734/730823

Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top