Web & AOR Music Blog

I'm Web Front-End Engineer. I like AOR music.

アプリ映像11 (HTML5 API 3 & Flash1)

■HTML5 API

(8)Geolocation ~ 【HTML5_API/geolocation/geolocation.html】

 ※なんで、pdfに載っていないんだ!メモめも・・・

位置情報を取得する Geolocation APIが利用できる。
 デバイス関係ななく、同じ記述で位置情報の処理が実現できる。

 無線LAN・WiFi・携帯電話基地局・GPS・IPアドレスなどから位置情報を取得します。
 接続環境次第で、取得できる位置情報の精度や取得に掛かる時間が異なります。

 ユーザーのセキュリティとプライバシーに配慮した仕様
 位置情報をリクエストすれば必ず許可が必要が必要となります。
 ユーザーはブラウザの確認ウィンドウで、位置情報の取得の許可をするかどうかを選択できるようになっています。

 ◇geolocation
  位置情報を取得することができる APIです。
  geolocationがサポートされているブラウザであれば、デバイス関係なしで使用することが可能です。
 ローカルニュースなど位置情報からサービスを広げることも可能です。

 サポート情報の確認

http://caniuse.com/#search=geolocation

http://caniuse.com/

 

◇位置を取得
  位置を取得する方法が2つあります。

  ●現在の位置を取得する
  navigator.geolocation.getCurrentPosition( 成功, 失敗, option)

  ●位置を定期的に取得する
  navigator.geolocation.watchPosition( 成功, 失敗, option)

 成功時には「positionオプジェクト」を取得します。
 取得内容は以下の通りです。

  position.coords 緯度経度などの情報
  poition.timestamp 位置を取得した時刻
 

 ◇位置を取得
 
  position.coords で取得した緯度経度の情報について

  coords.latitude ・・・ 緯度
  coords.longitude ・・・ 経度
  coords.altitude ・・・ 高度
  coords.accurancy ・・・ 正確性
  coords.altitudeAccurancy ・・・ 高度の正確性
  coords.heading ・・・ 方位
  coords.spped ・・・ 速度

 ◇失敗時の取得

  失敗時には「errorオブジェクト」を取得します。
  取得内容は以下の通りです。

  error.code ・・・ エラーコード
                1.位置情報の取得が許可されていない
                2.位置情報の取得が利用できない
                3.タイムアウト

  error.message ・・・ エラーメッセージ
 

 ◇option の指定
 
  3つめの引数では関数を実行する時のオプションを指定します。
  指定しなくても可能。

  option.enableHighAccuracy ・・・ より高い正確性を求める(取得時間が遅くなる)スマフォではGPSを利用する
  ※スマフォでは指定しない方がいい?

  option.timeout ・・・ 処理のタイムアウト
  option.maximumAge ・・・ キャッシュされている位置情報オプジェクトを許容するキャッシュ時間
 

 ◇取得停止
  定期的に取得する「watchPosition」を取得する方法

  navigator.geolocation.clearWatch( watchID)

  「watchPosition」は制作時にidを返します。
  idを使用して「clearWatch」で停止させます。

 ※落ち着いたら、jQuery Mobileと連動してみて、iPhone でテストしてみよう!!!

 ★素材写真のフォルダーをコピーしよう~~~!!!

 ◎簡単な JavaScriptでの、無名関数の使い方を、テストしてみよう vVV

■Flash

 フレームの挿入 F5

Copyright © Web & AOR Music Blog, All Rights Reserve.