Yahoo!地図のAPI(12) -絵画したラインの距離を測定する-

クリックするたびに地図上に線を引けるようにしたが、その線の距離を測定できるようにする。ようやく機能らしいものが実装できそうだ。

 地図サンプル


前回でクリックした座標を配列に入れていたので、距離測定するときにその配列を利用して統計するばよい。

以下のものをJavaScript内に記述する。

function sumLong() {
var mathLong = 0;
for(i = 0; i < lenp.length-1; i++) {
x1 = lenp[i].lat;
y1 = lenp[i].lon;
x2 = lenp[i+1].lat;
y2 = lenp[i+1].lon;
mathLong += Math.sqrt(Math.pow(Math.abs(x1 - x2),2) + Math.pow(Math.abs(y1 - y2),2));
}
mathLong = mathLong * 100;
alert("\n距離は " + mathLong + " Kmです\n");
}



そして、

「onClick="sumLong()"」これをAタグなどに付け加えることでクリック時に距離測定が行われる。

 地図サンプル

 距離測定


本当に距離があっているか試すために、右下のスケールに合わせてラインを引いてみると、ほぼ近似値を取ったので測定方法は間違っていないようだ。


最近運動不足なので散歩のルート測定したり、ドライブ時の距離測定など活用用途は高い。

特にETCの早朝割引などは100Km以内という制限があるので、100Km以内のICをこれで調べ、そこで出入りすれば半額で利用できる。

そのうちもっと手軽に実装できるようになりそうな気がする。

ブログ気持玉

クリックして気持ちを伝えよう!

ログインしてクリックすれば、自分のブログへのリンクが付きます。

→ログインへ

なるほど(納得、参考になった、ヘー)
驚いた
面白い
ナイス
ガッツ(がんばれ!)
かわいい

気持玉数 : 0

この記事へのコメント

この記事へのトラックバック