1. ホーム
  2. javascript

[解決済み] 地図上のマーカーをすべてカバーするために、地図の中心/ズームを設定しますか?

2022-03-26 08:06:02

質問

地図上に複数のマーカーを設定していますが、ズームレベルや中心を静的に設定することができます。

利用可能な方法は以下の通りです。

setZoom(zoom:number)

そして

setCenter(latlng:LatLng)

どちらも setCenter は、複数の場所や場所配列の入力をサポートしていません。 setZoom はこのような機能を備えていません。

解決方法は?

を使用する必要があります。 fitBounds() メソッドを使用します。

var markers = [];//some array
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markers.length; i++) {
 bounds.extend(markers[i]);
}

map.fitBounds(bounds);


ドキュメンテーション から developers.google.com/maps/documentation/javascript :

<ブロッククオート

fitBounds(bounds[, padding])

パラメータです。

`bounds`:  [`LatLngBounds`][1]|[`LatLngBoundsLiteral`][1]
`padding` (optional):  number|[`Padding`][1]

戻り値です。 なし

与えられた境界を含むようにビューポートを設定します。
備考 : マップに設定されている場合 display: none は、その fitBounds 関数は、マップの大きさを 0x0 そのため、何もしません。マップを非表示にした状態でビューポートを変更するには、マップを visibility: hidden これにより、map div が実際のサイズになるようにします。