飴屋

GMAPS / ズームの限定

表示領域の限定の内容と少し重なりますが、Google Mapsを使用して世界地図を眺める際に、表示領域の拡大倍率を自由に変更できるわけですが、地域によっては詳細な地図がまだ用意されていない場合があります。そんな地域の地図の表示に当たっては、これ以上拡大して欲しくないという場合もあるかと思います。逆に、地図の縮尺を大きくし過ぎても使い勝手が悪くなるのを防ぎたい場合もあるかと思います。

そんなときは表示領域の限定のときと同様に、地図のズームレベルが変更された際にイベントを取得して、ズームレベルに制限を加えてあげるといいです。

var ZOOM_IN_LIMIT = 18;
var ZOOM_OUT_LIMIT = 14;
var map = new GMap2(document.getElementById("map"));
GEvent.addListener(map,"zoomend",function(oz,nz) {
if (nz>ZOOM_IN_LIMIT) map.setZoom(oz);
if (nz<ZOOM_OUT_LIMIT) map.setZoom(oz);
});

一行目、二行目でズームインの限界レベル、ズームアウトの限界レベルを定数に設定してあります。ズームレベル3ぐらいで300x300ピクセルの領域に日本全体が入るか入らないかというところでしょうか。

三行目で地図のオブジェクトを作成し、四行目のGEvent.addListenerメソッドで
"zoomend"イベント時に実行する関数の定義を開始します。
関数にはズームレベルの変更前のレベルと変更後のレベルが引数に渡されるので、
変更後のレベルが設定範囲外の場合、setZoomメソッドで変更前のレベルに戻してやります。

Last-Modified