[解決済み] Google Maps V3 - 指定した境界線に対するズームレベルの計算方法
質問
Google Maps V3 APIを使用して、次のような方法で、指定した範囲のズームレベルを計算する方法を探しています。
getBoundsZoomLevel()
をV2 APIで使用することができます。
以下は、私がやりたいことです。
// These are exact bounds previously captured from the map object
var sw = new google.maps.LatLng(42.763479, -84.338918);
var ne = new google.maps.LatLng(42.679488, -84.524313);
var bounds = new google.maps.LatLngBounds(sw, ne);
var zoom = // do some magic to calculate the zoom level
// Set the map to these exact bounds
map.setCenter(bounds.getCenter());
map.setZoom(zoom);
// NOTE: fitBounds() will not work
残念ながら
fitBounds()
メソッドを使用することができます。このメソッドは、地図上のマーカーにフィットさせるにはうまく機能しますが、正確な境界を設定するにはうまく機能しません。以下は、なぜ
fitBounds()
というメソッドがあります。
map.fitBounds(map.getBounds()); // not what you expect
解決方法は?
同様の質問がGoogleグループにも寄せられています。 http://groups.google.com/group/google-maps-js-api-v3/browse_thread/thread/e6448fc197c3c892
ズームレベルは不連続であり、各ステップでスケールが2倍になります。そのため、一般的には、(特定の地図サイズによほど運が良くない限り)希望する境界線にぴったりと合わせることはできません。
もう一つの問題は、辺の長さの比率です。例えば、正方形の地図の中にある薄い長方形には、境界を正確に合わせることはできません。
地図divのサイズを変えるにしても、どのサイズに変更するか、それに対応するズームレベルを選択しなければならないので(大雑把に言えば、現在より大きくするか小さくするか)、どうすれば正確に境界線を合わせられるか、簡単な答えはありません。
もし本当にズームを保存するのではなく、計算する必要があるのなら、これでうまくいくはずです。
メルカトル図法では緯度はゆがむが、経度の差は常に地図の幅の同じ割合(角度の差÷360)で表される。世界地図はズームゼロで256x256ピクセル、一段ズームすると幅も高さも2倍になります。したがって、地図の幅がピクセル単位でわかっていれば、ちょっとした代数計算で次のように倍率を計算することができる。なお、経度は周りを囲んでいるので、角度が正であることを確認しなければならない。
var GLOBE_WIDTH = 256; // a constant in Google's map projection
var west = sw.lng();
var east = ne.lng();
var angle = east - west;
if (angle < 0) {
angle += 360;
}
var zoom = Math.round(Math.log(pixelWidth * 360 / angle / GLOBE_WIDTH) / Math.LN2);
関連
-
[解決済み】ReferenceError: google is not defined
-
[解決済み] Googleマップのtransit_stationにはバスステーションも表示される
-
[解決済み] ReferenceError: googleは定義されていません。
-
[解決済み] google map API 拡大範囲
-
[解決済み] Google Maps APIでマウスのスクロールホイールによる拡大縮小を無効にする方法
-
[解決済み】このAPIプロジェクトは、このAPIを使用する権限がありません。このAPIがAPIコンソールで有効になっていることを確認してください。
-
[解決済み】Google Maps API v3:fitBoundsの後にsetZoomを設定できますか?
-
[解決済み] GISサービスにおける緯度・経度タプルの記述順の優先度について
-
[解決済み] Google Maps: 緯度/経度を指定して国、州、地域、都市を取得する方法とは?
-
[解決済み] Google Maps V3: ストリートビューを無効にする方法は?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Google Maps APIの警告。NoApiKeys
-
[解決済み] ReferenceError: googleは定義されていません。
-
[解決済み] Android StudioのデバッグモードでSHA-1フィンガープリント証明書を取得する方法を教えてください。
-
[解決済み] 住所をGoogleマップのリンクに変換する方法(NOT MAP)
-
[解決済み】Google Map API v3 - 境界と中心を設定する
-
[解決済み】このAPIプロジェクトは、このAPIを使用する権限がありません。このAPIがAPIコンソールで有効になっていることを確認してください。
-
[解決済み] Google Mapsのマーカーの色を変更するにはどうしたらいいですか?
-
[解決済み] Google Maps V3 - 指定した境界線に対するズームレベルの計算方法
-
[解決済み] Google Mapsに影響を与えるTwitter BootstrapのCSS
-
[解決済み] GISサービスにおける緯度・経度タプルの記述順の優先度について