Calculating the bounding box using Javascript

Question

I have a latitude/longitude value and distance value. I need to calculate a bounding box with the given location as the center. so if the distance was 200 meters then the rectangle box should be 200 meters in front, behind, to left and right.

How do I go about doing this using JavaScript?

Answer 1

You need to translate your coordinate lat/long to a x/y-value in the map projection you are using, then you can calculate your bounding box.

I don't know the Google Maps API well, and I don't know exactly what you want to do with your box. But maybe GBounds, GMercatorProjection and GLatLngBounds can be helpful. And if Google Maps API doesn't support calculations for the map projection you are using, then it can be helpful to use Proj4js. And maybe you want to read up about Map projections. Google Maps is by default using Mercator projection.

Answer 2

If you're using the V3 API, you can make use of Rectangle and Circle. See this blogger's brief description and examples:

http://apitricks.blogspot.com/2010/02/rectangle-and-circle-of-v3.html

Answer 3

Here are a number of useful javascript functions for working with latitude and longitude:

http://www.movable-type.co.uk/scripts/latlong.html

For bounding box around a point, a simple modification using the above javascript library might be:

LatLon.prototype.boundingBox = function (distance)
{
    return [
        this.destinationPoint(-90, distance)._lon,
        this.destinationPoint(180, distance)._lat,
        this.destinationPoint(90, distance)._lon,
        this.destinationPoint(0, distance)._lat,
    ];
}

(This uses the "Destination point given distance and bearing from start point" calculation.)