Fork me on GitHub


The Javascript Mapping Abstraction Library

Points and Bounding Boxes

For almost everything you’d want to do with a map, you need to be able to tell Mapstraction where on the Earth’s surface you want to do things, such as show the map, centre the map, display a marker and so on. The fundamental building blocks for this are two Javascript classes, mxn.LatLonPoint and mxn.BoundingBox.


As the name suggests, a point describes a specific point on the Earth’s surface, expressed as a pair of latitude and longitude coordinates; the latitude specifies the north/south position and the longitude specifies the east/west position.

For example, to specify the centre of London you would create a mxn.LatLonPoint with a latitude of 51.50731 and a longitude of -0.12768, as shown below.

var point = new mxn.LatLonPoint(51.50731, -0.12768);

Bounding Boxes

Another commonly used way of describing a place on the Earth’s surface is with a bounding box, sometimes referred to as a minimum bounding rectangle or MBR. Whereas a latitude/longitude point describes a single, specific, point a bounding box describes a larger area, expressed as a rectangle with coordinates for the south west and north east corners The mxn.BoundingBox Mapstraction class allows you to easily create and manage bounding boxes.

Following on from the London example above, the area of Greater London can be described by two points, 51.28, -0.489 for the south west corner and 51.686, 0.236 for the north east corner.

var bb = new mxn.BoundingBox(51.28, -0.489, 51.686, 0.236);

It’s important to note that a bounding box is not the precise or exact outline of the place that it’s representing, it’s merely the smallest rectangle that will cover all the points of the place.