FC2ブログ

google map でブラウザから取得した緯度経度をもとに地図を表示

google map でブラウザから取得した緯度経度をもとに地図を表示

#18 現在地の地図を表示する (2)
http://dotinstall.com/lessons/basic_google_maps/3518
を参考に
ブラウザから取得した緯度経度をもとに地図を表示

まず
if(navigator.geolocation){
で対応できているのなら
現在地の取得をする

現在地を取得するには
navigator.geolocation.getCurrentPosition(function(position){
取得できたときの処理
},
function(){
取得できなかったときの処理
});
とする

大抵の場合取得できないのなら
エラー表示するので
alert("現在地が取得できませんでした");
というようにする

取得できたときの処理は
var map = new google.maps.Map(document.getElementById('map'), options);

で設定したmap の center の値と function(position)の値
を使う

map.setCenter(
new google.maps.LatLng(position.coords.latitude,
position.coords.longitude));

map.setCenter() は表示する地図の中心座標の設定
ここの値を
new google.maps.LatLng() で
設定している
このLatLng() には緯度経度を指定する

position.coords.latitude が
positionで返ってきた現在地の緯度
position.coords.longitude が
positionで返ってきた現在地の経度

latitude が英語で緯度
longitude が英語で経度
という意味

ここまでできたら、動作確認
私の場合、Ubuntuなので
mkdir /var/www/gmap
でここに index.html をコピー
あとは
apache2 を
sudo service apache2 start で起動して
ifconfig でIPを確認して
iPod touch で
ipアドレス/gmap
でアクセスして動作確認

もし、うまくいかないのなら
PC で chrome で Ctrl + shift + j
でdeveloper tools を起動してバグを特定して修正
スポンサーサイト



テーマ : プログラミング
ジャンル : コンピュータ

コメント

非公開コメント

最新記事
検索フォーム
GREEハコニワ攻略サイト
リンク
カテゴリ
月別アーカイブ
フリーエリア
最新記事
FXプライムレート
最新コメント
最新トラックバック