スポンサーサイト

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。



  

IMGタグを使用したGoogleStaticMapの設置方法

Googlemapはjavascriptで実装されているため、javascriptの使用できない携帯端末からはアクセスができなかった。調べてみたところ、GoogleはGoogleStaticMapというAPIも提供しており、こちらはJavascriptが使用できない環境でも実装できるということだったので試してみた。

GoogleStaticMapを実装する際にも、GoogleMapを実装するのと同じようにMapsAPIキーが必要だった。MapsAPIキーとはGoogleが無料で発行しているサイトごとの暗号のことで、下記のサイトから申請が行える。

http://code.google.com/intl/ja/apis/maps/signup.html

申請の際に、設置URLを指定する必要があり、登録後に取得するMapsAPIキーはそのURLでのみ使用することができる。別のURLから使用しようとすると画面に警告が表示される。

MapsApiキーを取得できたら、地図を表示させたい場所に以下のようなパラメータを含むIMGタグを設置する。

<img src="問い合わせURL">

指定できる項目には主に以下のような種類がある
●center マップの中心座標(緯度・軽度)の順にカンマ区切りで指定する
●zoom  尺度(0 ~ 18)
●size  画像のサイズ(横,縦)
●format 画像のフォーマット(jpg gif)
●maptype 地図の種類(roadmap mobile satellite terrain hybrid)
●markers マーカーを打つ(緯度・経度・マーカーのサイズ、マーカーの色,マーカー内に表示するアルファベット)の順にカンマ区切りで指定する
●key   GoogleMapsAPIを使用するために必要なキー(※後述)
●sensor GPS等のセンサー使用の有無

つなぎ合わせると以下のようになる
?center=緯度,経度&zoom=尺度,size=縦のサイズ,横のサイズ,format=画像のフォーマット,maytype=地図の種類,key=URLごとのMapsKey,sensor=センサー使用の有無

この情報をgoogleStaticMapのAPIに問いあわせることで地図画像を画面に表示できる。

実装例はこちら
関連記事
スポンサーサイト



  

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

コメント

非公開コメント

検索フォーム
プロフィール

サトリヒロシ

Author:サトリヒロシ
ビジネスを重視した企画を支援したいエンジニアが、何かを書こうとするブログです。

サトリ潜伏先
サトリ倉庫

WEB関連の技術で調査リクエストがあればご連絡ください。

カレンダー
09 | 2017/10 | 11
1 2 3 4 5 6 7
8 9 10 11 12 13 14
15 16 17 18 19 20 21
22 23 24 25 26 27 28
29 30 31 - - - -
カテゴリ
最新記事
最新コメント
最新トラックバック
月別アーカイブ
RSSリンクの表示
リンク
QRコード
QRコード
FC2カウンター
スポンサードリンク
上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。