CODEWITHSUNDEEP
javascriptgoogle-mapscoordinate-transformation
ssbb
ssbb

Reputation: 1931

conversion latitude/longitude into distance

My problem is a bit tricky, apologyze if my question isn't clear at all.

I use googleMap v3 API. the user can clique on the map to create a mark , if he click on the mark , i give latitude & longitude info into a infoWindow (this is done and it's OK)

The things a try to do : the user can give dimension (km/miles) and I have to draw a rectangle of the given size (the create mark shoud be the middle of the area). The probleme come from latlng or bounds who take only latitude & longitude. so I try to convert it.

here is the main part of the code.

//latitude
// 1°lat = 111,11 km
//for me: 1km = 0.00900 .

//longitude
//1°lat =  111,11 km * cos latitude
// for me : 1 km = ((1/Math.cos(latitude)) /111.11)

var myBounds = new Array();

var longkm = 5;
var largkm = 2;
myBounds[0] = new google.maps.LatLngBounds(
    new google.maps.LatLng(positionmarqueur.lat()-(0.009*longkm), positionmarqueur.lng()-(Math.abs(((1/Math.cos(positionmarqueur.lat()-(0.009*longkm))) /111.11))*largkm)),
    new google.maps.LatLng(positionmarqueur.lat()+(0.009*longkm), positionmarqueur.lng()+(Math.abs(((1/Math.cos(positionmarqueur.lat()+(0.009*longkm))) /111.11))*largkm))
);

var overlay1 = new google.maps.Rectangle({
    map: map,
    bounds: myBounds[0],
    strokeColor: "green",
    strokeWeight: 1
});

var longkm = 10;
var largkm = 10;
myBounds[1] = new google.maps.LatLngBounds(
    new google.maps.LatLng(positionmarqueur.lat()-(0.009*longkm), positionmarqueur.lng()-(Math.abs(((1/Math.cos(positionmarqueur.lat()-(0.009*longkm))) /111.11))*largkm)),
    new google.maps.LatLng(positionmarqueur.lat()+(0.009*longkm), positionmarqueur.lng()+(Math.abs(((1/Math.cos(positionmarqueur.lat()+(0.009*longkm))) /111.11))*largkm))
);

var overlay2 = new google.maps.Rectangle({
    map: map,
    bounds: myBounds[1],
    strokeColor: "blue",
    strokeWeight: 1
});

This shoud draw a 5,2 rectanle and a 10,10 rectangle(well , a 10km square) (for info : var positionmarqueur = latLng; above in the code)

if I take a look to the result : the first rectangle look more than a 50/20 km. (did i do a mistake when i divide? with a 10 factor? i'm not very good in mathematic, but it look correct).

The seconde.... just look like a 200*40 km rectangle ....

So. Where is the probleme? Is the formule wrong ? Or i'm just dumb and i miss something ?

Thinqs.

Upvotes: 3

Views: 1181

Answers (1)

Gabriele Petrioli
Gabriele Petrioli

Reputation: 195992

The algorithm to use is

  var largkm = 5,
      longkm = 10;

  var bounds = new google.maps.LatLngBounds(
    new google.maps.LatLng(positionmarqueur.lat() - ((largkm/2)/110.54), positionmarqueur.lng() - ((longkm/2)/(Math.cos(positionmarqueur.lat())*111.32))),
    new google.maps.LatLng(positionmarqueur.lat() + ((largkm/2)/110.54), positionmarqueur.lng() + ((longkm/2)/(Math.cos(positionmarqueur.lat())*111.32)))
  );

(note: i am dividing the rectangle size by 2 since we are defining the bounds from the center)

Demo at http://jsfiddle.net/gaby/a5QVM/

Update

You should use the google geometry library which uses whatever projection the google maps use, so transformations will be accurate. (you will need to change the URL for the google API to http://maps.googleapis.com/maps/api/js?libraries=geometry&sensor=false)

More specific you should use the google.maps.geometry.spherical.computeOffset method

var rectbounds = new google.maps.LatLngBounds(
    spherical.computeOffset(spherical.computeOffset(positionmarqueur, longkm*1000/2, -90),largkm*1000/2,0),
    spherical.computeOffset(spherical.computeOffset(positionmarqueur, longkm*1000/2, 90), largkm*1000/2,180)
);

Updated demo at http://jsfiddle.net/a5QVM/10/
(the *1000 is to convert the distance to meters as that is what is expected from the computeOffset method)

Upvotes: 3

Related Questions