Skip to main content

LatLngBounds

The LatLngBounds object represents the bounding area of one or more latitude/longitude points.

LatLngBounds extends Base.

Usage example

const bounds = G.latLngBounds({
latitude: 40.712,
longitude: -74.227
});
bounds.extend([40.712, -74.227]);
map.fitBounds(bounds);

const v = 'tset';
const v = 'test2';

Or you can get the bounds from a marker:

const marker = G.marker({
latitude: 40.712,
longitude: -74.227
});
marker.addTo(map);
const bounds = G.latLngBounds();
bounds.extend(marker.getPosition());
map.fitBounds(bounds);

Creating the LatLngBounds object

G.latLngBounds(latLngValue?: LatLngBoundsValue): LatLngBounds

The G.latLngBounds() function takes a LatLngValue as the parameter.

There are a few ways to setup the LatLngBounds object.

No parameters.

G.latLngBounds(): LatLngBounds

In this case it's expected that you'll use the extend method to set each LatLng value.

const bounds = G.latLngBounds();
bounds.extend([40.712, -74.227]);

Pass a single LatLng value.

G.latLngBounds(latLngValue: LatLngValue): LatLngBounds

ParameterTypeRequiredDescription
latLngValueLatLngValueYesA latitude/longitude value.
const bounds = G.latLngBounds(latLngObject);
const bounds = G.latLngBounds([40.712, -74.227]);
const bounds = G.latLngBounds({lat: 40.712, lng: -74.227});
const bounds = G.latLngBounds({latitude: 40.712, longitude: -74.227});

Pass an array of LatLng values.

G.latLngBounds(latLngValue: LatLngValue[]): LatLngBounds

ParameterTypeRequiredDescription
latLngValueLatLngValue[]YesThe array of latitude/longitude values.
const bounds = G.latLngBounds([
latLngObject,
latLngObject2
]);
const bounds = G.latLngBounds([
[40.712, -74.227],
[40.774, -74.125]
]);
const bounds = G.latLngBounds([
{lat: 40.712, lng: -74.227},
{lat: 40.774, lng: -74.125}
]);
const bounds = G.latLngBounds([
{latitude: 40.712, longitude: -74.227},
{latitude: 40.774, longitude: -74.125}
]);

Pass an object containing the northeast and southwest LatLng values.

G.latLngBounds(object: LatLngBoundsEdges): LatLngBounds

ParameterTypeRequiredDescription
objectLatLngBoundsEdgesYesAn object containing the northeast and southwest values.
const bounds3 = G.latLngBounds({
ne: G.latLng(44.7, -70.8),
sw: G.latLng(44, -68),
});

Pass an object containing the separate north, east, south, west values.

G.latLngBounds(object: LatLngBoundsLiteral): LatLngBounds

ParameterTypeRequiredDescription
objectLatLngBoundsLiteralYesAn object containing the north, east, south, and west values.
const bounds3 = G.latLngBounds({
north: 44.7,
east: -70.8,
south: 44,
west: -68
});

Pass an existing LatLngBounds object.

G.latLngBounds(object: LatLngBounds): LatLngBounds

In this case the LatLngBounds object is simply returned.

ParameterTypeRequiredDescription
objectLatLngBoundsYesA LatLngBounds object.
const bounds = G.latLngBounds(boundsObject);

LatLngBounds value type

The LatLngBoundsValue can be one of the following values:

LatLngBoundsEdges value type

This is an object containing the northeast and southwest values.

PropertyTypeDescription
eastLatLngValueThe northeast value.
northLatLngValueThe southwest value.

LatLngBoundsLiteral value type

This is an object contianing the east, north, south, and west values.

This is identical to the google.maps.LatLngBoundsLiteral object.

PropertyTypeDescription
eastnumberThe east longitude value.
northnumberThe north latitude value.
southnumberThe south latitude value.
westnumberThe west latitude value.

Methods

  • Methods inherited from Base.

contains

contains(latLngValue: LatLngValue): boolean

ParameterTypeRequiredDescription
latLngValueLatLngValueYesThe latitude and longitude value.

Returns whether the given LatLng value is within this bounds

if (bounds.contains([40.712, -75.227])) {
// do something
}

equals

equals(other: LatLngBounds): Promise<boolean>

Returns whether this bounds approximately equals the given bounds.

You must pass another LatLngBounds object to test.

ParameterTypeRequiredDescription
latLngValueLatLngBoundsYesThe other LatLngBounds object to test.
const equals = await bounds.equals(bounds);

extend

extend(latLngValue: LatLngValue | LatLngValue[]): LatLngBounds

Extends this bounds to contain the given point.

ParameterTypeRequiredDescription
latLngValueLatLngValue or array of LatLngValue valuesYesThe latitude and longitude value(s).
bounds.extend([40.712, -74.227]);

You can pass the LatLngValue in a few ways.

Pass a single LatLng value:

bounds.extend(latLngObject);
bounds.extend([40.712, -74.227]);
bounds.extend({lat: 40.712, lng: -74.227});
bounds.extend({latitude: 40.712, longitude: -74.227});

Pass an array of LatLng values:

bounds.extend([
latLngObject,
latLngObject2
]);
bounds.extend([
[40.712, -74.227],
[40.774, -74.125]
]);
bounds.extend([
{lat: 40.712, lng: -74.227},
{lat: 40.774, lng: -74.125}
]);
bounds.extend([
{latitude: 40.712, longitude: -74.227},
{latitude: 40.774, longitude: -74.125}
]);

getCenter

getCenter(): LatLng

Gets the center of the LatLngBounds.

If the bounds has no lat/lng values then the center will be 0, -180.

If the bounds only has one lat/lng value then the center will be that lat/lng value.

const center = bounds.getCenter();

getNorthEast

getNorthEast(): LatLng

Get the north-east corner of the LatLngBounds.

If the bounds has no lat/lng values then the north-east value will be 0, -180.

If the bounds only has one lat/lng value then the north-east value will be that lat/lng value.

const ne = bounds.getNorthEast();

getSouthWest

getSouthWest(): LatLng

Get the south-west corner of the LatLngBounds.

If the bounds has no lat/lng values then the south-west value will be 0, -180.

If the bounds only has one lat/lng value then the south-west value will be that lat/lng value.

const sw = bounds.getSouthWest();

intersects

intersects(other: LatLngBounds): Promise<boolean>

Returns whether this bounds shares any points with the other bounds.

ParameterTypeRequiredDescription
otherLatLngBoundsYesThe other LatLngBounds object to test.
const intersects = await bounds.intersects(bounds2);

isEmpty

isEmpty(): boolean

Returns whether this bounds is empty.

if (bounds.isEmpty()) {
// Do something
}

toGoogle

toGoogle(): Promise<google.maps.LatLngBounds>

Returns the Google Maps LatLngBounds object.

bounds.toGoogle().then((gmLatLngBounds) => {
// Do something
});

toJson

toJson(): google.maps.LatLngBoundsLiteral

Converts the LatLngBounds object to a JSON object.

Example:

{south: 40.774, west: -76.227, north: 42.715, east: -74.125}

const json = bounds.toJson();

toString

toString(): string

Converts the LatLngBounds object to a string.

It will be in this format:

((SW.lat, SW.lng), (NE.lat, NE.lng))

For example:

((40.774, -76.227), (42.715, -74.125))

const string = bounds.toString();

toUrlValue

toUrlValue(): string

Returns the LatLngBounds object as a string that can be used in a URL.

The value will be in this format:

SW.lat,SW.lng,NE.lat,NE.lng

For example:

40.774,-76.227,42.715,-74.125

const urlValue = bounds.toUrlValue();

union

union(other: LatLngBounds | google.maps.LatLngBounds): Promise<void>

Extends the bounds of the current LatLngBounds object to contain the union of it and the given bounds.

ParameterTypeRequiredDescription
otherLatLngBounds | google.maps.LatLngBoundsYesThe other LatLngBounds object to include.
bounds.union(otherLatLngBoundsObject)
.then(() => {
// Do something here
});