こんばんは、やましょです!
今回はJavaScriptで、位置情報を取得してみましょう!
どのようなことができるのか?
- 閲覧デバイスの緯度の取得
- 閲覧デバイスの経度の取得
今回作成するもの
ボタンを押すと位置情報を取得して、緯度・経度を表示してくれます!

緯度と経度って、どっちがどっちか忘れるよね
実際にやってみよう!
Geolocation.getCurrentPosition()
メソッドを使うことで、現在の位置情報を取得することができます!
navigator.geolocation.getCurrentPosition(success, error, options)
引数
第1引数 success
取得処理が成功したときの処理を渡します。
(画面に表示する、計算する、、などなど)
第2引数 error
取得処理の際にエラーが発生した場合の処理を渡します。
こちらは省略可能です。
第3引数 options
オプションを指定できます。
こちらは省略可能です。
完成したもの
See the Pen 【JavaScript】Geolocation getCurrentPosition by Syohei Yamaki (@syohei-yamaki) on CodePen.
取得できましたね!
※埋め込みの環境によって取得ができない可能性があります。その場合はCodepenへ遷移して動作確認をしてみてください。
最後に
「よこいけいた君」って知ってますか??
これでよこ
がいど
で、けいど
がたて
、と覚えることができます😇
これでケアレスミスがなくなりますね。
そんな緯度経度の取得方法でした!
よこいけいた君、ありがとう!!