LatLngBounds
LatLngBoundsクラスは境界(Bounding box)のインスタンスを作成するためのクラスです。境界とは、範囲のことです。インスタンスを作る時に引数で境界の左下と右上の位置座標を指定できますが、これらの引数は省略可能で空の境界を作ることもできます。このインスタンスは、任意の数の位置座標を含み、それら全ての位置座標を包める最小の矩形が境界となります。
構文
パラメータ
sw
省略可能。範囲の南西(左下)にあたる位置座標を、LatLngクラス、またはLatLngLiteralオブジェクトで指定する。
ne
省略可能。範囲の北東(右上)にあたる位置座標を、LatLngクラス、またはLatLngLiteralオブジェクトで指定する。
返り値
LatLngBounds
LatLngBoundsクラスのインスタンス。このインスタンスにメソッドを実行して位置座標を追加したり、境界を示す値として利用できる。
デモ
境界のインスタンスを作成します。そのインスタンスを、レクタングルの値として指定します。境界の内容を変更して、どのように反映されるか確認してみて下さい。
var latLngBounds = new google.maps.LatLngBounds(
new google.maps.LatLng( 32.7294, 132.3692 ) ,
new google.maps.LatLng( 34.3955, 134.6104 )
) ;
var rectangle = new google.maps.Rectangle( {
map: map ,
bounds: latLngBounds ,
} ) ;
サンプルコード
インスタンスの作成
var latLngBounds = new google.maps.LatLngBounds(
new google.maps.LatLng( 32.7294, 132.3692 ) ,
new google.maps.LatLng( 34.3955, 134.6104 )
) ;
HTML
<!DOCTYPE html>
<html>
<head>
<style>
#map-canvas {
width: 600px ;
height: 600px ;
}
</style>
</head>
<body>
<div id="map-canvas"></div>
<script src="//maps.googleapis.com/maps/api/js?key={APIキー}"></script>
<script>
var mapDiv = document.getElementById( "map-canvas" ) ;
// Map
var map = new google.maps.Map( mapDiv, {
center: new google.maps.LatLng( 35.71, 139.8107 ) ,
zoom: 11 ,
} ) ;
// LatLngBounds
var latLngBounds = new google.maps.LatLngBounds(
new google.maps.LatLng( 32.7294, 132.3692 ) ,
new google.maps.LatLng( 34.3955, 134.6104 )
) ;
// LatLngBoundsを可視化
new google.maps.Rectangle( { map:map, bounds:latLngBounds, } ) ;
// fit bounds
map.fitBounds( latLngBounds ) ;
</script>
</body>
</html>
メソッド
名前 | 説明 |
---|---|
contains() | 位置座標が境界の範囲内に含まれるか否かを確認する。 |
equals() | 2つの境界が同じか否かを判定する。 |
extend() | 境界に位置座標を追加する。 |
getCenter() | 境界の中心の位置座標を取得する。 |
getNorthEast() | 境界の北東(右上)の位置座標を取得する。 |
getSouthWest() | 境界の南西(左下)の位置座標を取得する。 |
intersects() | 2つの境界に重なる部分があるか否かを判定する。 |
isEmpty() | インスタンスが空か否かを確認する。 |
toJSON() | 境界の北東(右上)、南西(左下)の位置座標をJSONに変換する。このJSONはLatLngBoundsLiteralオブジェクトである。 |
toSpan() | 境界の北東(右上)と南西(左下)を結ぶ対角線の距離。 |
toString() | 境界の北東(右上)、南西(左下)の位置座標を文字列に変換する。 |
toUrlValue() | 境界の北東(右上)、南西(左下)の位置座標を、桁数を丸めた文字列に変換する。 |
union() | 2つの境界を合成する。 |
参考
- Google Maps JavaScript API: LatLngBounds
- Googleの公式リファレンス。