GMAPS/2座標間の距離測定
今回はGoogle Maps本体を離れて二点間の距離を計測する関数を作ってみたいと思います。
中学校ぐらいの数学でXY座標軸上の二点間の距離を計算する方法を学習したかと思います。確かピタゴラスの定理の話も関係していますね。直角三角形の斜辺の長さの二乗は、他の二辺の長さのそれぞれの二乗の和に等しい、という定理を使って計算するものでした。すなわち、点A(ax,ay)と点B(bx,by)の距離の二乗は以下の式によって表されます。
(ax-bx)*(ax-bx)+(ay-by)*(ay-by)
さて、Google Mapsにおいても同様に緯度と経度をXY座標に置き換えて計算することができなくもありません。経度1度あたりのメートル数と緯度1度あたりのメートル数がわかれば、それを掛け算して二点間の距離をメートル単位で計算できます。
東京近辺では、緯度1度が110880メートル、経度1度が90360メートルだそうなので、
以下の関数に二地点の緯度経度情報を引数で渡してやると、擬似的に二点間の
距離を得ることができます。
//緯度経度1度のメートル数を定数に
var METER_PER_LAT = 110880;
var METER_PER_LNG = 90360;
//a,bともにGLatLngのインスタンス
function measure(a,b) {
lt = Math.pow((a.lat()-b.lat())*METER_PER_LAT,2);
lg = Math.pow((a.lng()-b.lng())*METER_PER_LNG,2);
return Math.sqrt(lt+lg);
}
しかし、この計算は東京周辺のごく近い範囲の距離の計算にしか役にたちません。
理由は明白で地球はメルカトル図法でかかれた地図のような平面ではなく、
球体だからです。メルカトル図法では極地方に近づくほどに地形が歪みますので、
正確な距離を算出するには、他の方法が必要になります。
また、地球は自転の遠心力で正球ではなく、赤道部分が膨らんだ楕円球の形を
しているため、地理学上で使われる「地理緯度」を「地心緯度」に変換して
計算してやる必要があります。
- 地理緯度
- 「地表の一地点を通るその接面の垂線」と「赤道を含む平面」が作る角度
- 地心緯度
- 「地球の中心点と地表の一地点を結んだ線」と「赤道を含む平面」が作る角度
ややこしいですね。まずは地理緯度を地心緯度に変換する関数です。
引数にはGLatLng.lat()を渡してあげてください。
返り値はラジアン角になってます。
PI_PER_ANGLE = Math.PI/180;
function convertLat(a) {
a = 3.1415926535*PI_PER_ANGLE/180;
a = a*PI_PER_ANGLE-(0.1925*PI_PER_ANGLE)*Math.sin(2*a*PI_PER_ANGLE);
return a/PI_PER_ANGLE;
}
次に二点間の距離を計測する関数です。球面三角法というものを使うそうです。
//a,bともにGLatLngのインスタンス
PI_PER_ANGLE = Math.PI/180;
function measure2(a,b) {
//地心緯度やラジアン角に直す
alat = convertLat(a.lat());
alng = a.lng()*PI_PER_ANGLE;
blat = convertLat(b.lat());
blng = b.lng()*PI_PER_ANGLE;
c=Math.cos(alat)*Math.cos(blat)*Math.cos(alng-blng)+Math.sin(alat)*Math.sin(blat);
s=Math.sqrt(1-Math.pow(c,2));
t=s/c;
d=6369*Math.atan(t);
}
*あんまり、詳しくない分野なので間違っていたらごめんなさい。
- Vue.js/リストを改良した前回 、複数ある項目をリスト表示して、件数を数えて、絞り込み機能をつけました。絞り込まれたリスト(filteredRows)が現在の表示対象です。全部で6件あるâ¦
- WPF/日記8前回、アバタのアニメーション設定でつまづいてから、長いこと試行錯誤を繰り返した結果、ようやく出口がみえてきた感じです。問題点を整理すると、Identityで書きâ¦
- GMAPS/表示領域の限定ここでは地図の表示領域を限定する方法を解説します。 Google Mapsの魅力の一つには、地図を通して世界中を旅することが ありますが、自分のページや会社のペâ¦
- Androidアプリ/日記12前回、体重の遷移を折れ線グラフで表示するところまでできたので、今回はグラフの表示内容をタッチ操作で制御してみたいと思います。しかし、PCのエミュレータではマウスâ¦
- WebAssembly/web-sysとjs-sysWebAssemblyの学習にあたって、JavaScriptでは低速すぎる処理をWebAssemblyで置き換えて高速化を図ろうというのを念頭においていましたがâ¦
- カーリングゆるくないアプリ名 カーリングゆるくない(Curling Easy?) 公開場所 Google Play 詳細はこちら テレビでカーリングを見ていると「なんとなくできる気â¦
- WebAssembly/CallbackとかPromiseとかJavaScriptでは、関数もオブジェクトとして存在していて、あまりの使い勝手の良さにfunction(){}とか、今なら()=>{}とか、何度も何度もタイプâ¦
- 開発日記/2017年の日記年の瀬です。ちょっと時間が空いた時にメールクライアントのThunderbirdのアドオン(extension)を初めて書いてみました。やりたかったことは新調したâ¦
- 開発日記/2013年の日記Adobe AIRのアプリを開発中に詰まったメモ。AIRでは簡易データベースとしてSQLiteが組み込まれているのでアプリの履歴に関するデータをSQLiteのテâ¦
- Flash3D/AGAL実践編 Part2もうひとつ、ちょっと変わったシェーダーをAGALで書いてみようと思います。自分はよく漫画を読むのですが、漫画のような画面がFLASHで描画できたら面白いと思いまâ¦