このブログのはてなブックマーク数 このエントリーをはてなブックマークに追加

知らなきゃ絶対損するPCマル秘ワザ

知らなきゃ損するPC情報を分かりやすくメモする個人ブログ。
『月,水,金』の週3回更新!(予定)

このブログ内をキーワードで検索することもできます。
Loading



最新記事
  • Windows:動画のフレームサイズ等をエクスプローラーに表示 (02/24)
  • エクセル:テーブルの「フィルター」「並び替え」ボタンが消えた (02/22)
  • jQuery:追加した「ボタン」をクリックしてもイベントが発火しない (02/20)
  • PCモニタをWQHD(2560x1440)にしたら便利すぎて戻れない件 (02/17)
  • jQuery Mobile:追加した要素(select等)にスタイルが付かない (02/13)
  • 管理人より
    なにそれー!すごーい!たーのしー!

    Googleマップ API 携帯版

    このエントリーをはてなブックマークに追加

    こんにちは、さち です!

    以前に Googleマップ API について書きましたが
    前回のは JavaSctipt を使用したパソコン用の Googleマップ API でした。
    今回使うのは携帯版の Googleマップ API です。

    携帯電話はもちろんのことなのですが JavaScript が実装されていません。
    そのため、以前紹介した方法は利用できませんでした。

    今回紹介する Googleマップ API の携帯版 は JavaScript 利用しない方式のため
    携帯電話でも利用できます。
    もちろんパソコン上でも利用できます!
    この JavaScript を使わない Googleマップ API、正式名称は Google Static Maps API といいます。

    Google Static Maps API は Googleマップ API とは違い地図を操作するこができません。
    (PHPなどを使った Webアプリ を利用すれば可能だと思います)
    しかし、機能が少ない分、作成も非常に簡単なのが Google Static Maps API の利点です。

    使用するには前回紹介した Googleマップ API と同様に APIキー が必要となります。
    まだ APIキー を取得していない人は前回の記事を参考に取得してください。


    1. 実際に Google Static Maps API を使ってみる

    Google Static Maps API を利用するには次のような記述をします。

    <img src="http://maps.google.com/staticmap
    ?center=[緯度],[経度]
    &zoom=[ズームの値]
    &size=[画像の横幅]x[画像の高さ]
    &maptype=[roadmap or mobile]
    &markers=[緯度],[経度],[マーカーの色][アルファベット]
    &key=[GoogleマップAPIのキー]" />

    center:  地図の中心の位置を緯度と経度で指定します。日本の地図を表示する場合なら常に「緯度<経度」という関係が成り立つので、緯度と経度がどちらがどちらなのか分からなくなってしまったときはこの関係を思い出してみてください。
    zoom:  地図の縮尺を 0~19 の数字で指定します。0(広域)⇔19(詳細)になっています。
    size:  地図の表示画像の大きさを指定します。指定数値の単位は「ピクセル[px]」です。
    maptype:  地図のタイプを roadmap,mobile から指定します。携帯で使う場合は mobile にしておくといいみたいです。
    markers:  マーカーの位置,色,表示するアルファベット を指定をします。位置は前述 center 同様に緯度,経度で指定。色は red, blue, green から選択。アルファベットは a~z で指定します、色指定とアルファベットの指定の間にはスペースがなく連続して記述する点に注意です。アルファベットの指定は省略可能です。
    key:  自分が取得した GoogleマップAPIキー をここに入力します。

    記述方法を見て気が付いた人も多いかもしれませんが
    実は Google Statics Maps API の地図表示は imgタグ を使うのです。
    だから地図の表示は単なる画像で Googleマップ API できたような
    ドラッグで地図を動かしたり地図の拡大縮小を自由に変えるという操作が一切できません。


    2. 文字コードについて

    今回は Googleマップ API の携帯版として Google Static Maps API を紹介したので
    少し携帯の文字コード事情についても書いておこうと思います。

    実は携帯の文字コードは SHIFT-JIS が主流です。
    softbank のみが EUC-JP, UTF-8 などにも対応しているようですが
    他のキャリアからも利用できる HTMLファイル を作るのなら
    やはりサイトは SHIFT-JIS で作るのが賢明です。

    もちろん今回作った Google Static Maps API のページも SHIFT-JIS で保存しましょう。


    3. Google Static Maps API と Googleマップ API の違い

    恐らく百聞は一見にしかずなのでまずは見たり触ったりしてみましょう。

    こちらが Google Static Maps API です。

    そして、こちらが Googleマップ API です。

    簡単に違いを見ていきましょう。

    まず、2つの大きな違いとして Google Static Maps API は地図の表示は単なる画像で
    動かすことができませませんし、拡大縮小もできません。
    また、航空写真や右下のナビゲータもありません。
    マーカーに触れると分かりますが吹き出しをつけることもできません。

    しかし、表示が画像であるため地図を保存するのは簡単です。
    (通常の画像を保存する手順でOK)
    Googleマップ API ではキャプチャしなくてはいけないので
    この点は Google Static Maps API の方が便利ですね。

    Google Static Maps API の地図表示のソースはこんな感じです。
    よかったら参考にしてみて下さい。

    <img src="http://maps.google.com/staticmap
    ?center=35.6370693778054,139.88479614257812
    &zoom=13
    &size=400x300
    &maptype=mobile
    &markers=35.63037245811752,139.88093376159668,redd
    &key=[API_KEY]"/>


    Googleマップ API について知りたい方はこちらへどうぞ!

       → Googleマップ API を使ってみました


    【追伸】
    maptype の roadmaps と mobile の違いがいまいちよくわかりませんでした…。
    どなたか知っている方いないでしょうか?









    このエントリーをはてなブックマークに追加




    管理人だけが読めるコメントにする(返信はしません)
    【お知らせ】
    • コメントは承認制です。反映に時間がかかります。
    • Yahoo!BBはスパムコメントが多いため一部規制中です。
    • URLを含む投稿はできません。必要な場合は最初のhを削って下さい。
    • 記事に直接関係ない個人のトラブルにはお答えできません。
    • Android は使ったことがないので質問を頂いても答えられません。
    • その他詳細はこちら


    roadmaps と mobile の違い
    実際のところはよく分かりませんが、使ってみた感じでは
    1 mobile の方が付近の情報に詳しく roadmaps の方は全体的になっている
    2 画像が小さい時に mobile のほうが字が読みやすくなっている
    という印象を受けました
    taro | 2009/02/20/Fri [EDIT]
    >>taroさん
    貴重な情報を頂きましてありがとうございます。

    taroさんの情報からも
    やはりmobileはケータイ用に見やすくなっているのですね!
    さち | 2009/02/21/Sat [EDIT]



    記事別の週間アクセス数ランキングです。こちらの記事もぜひ読んでみて下さい。

    2008-2017 知らなきゃ絶対損するPCマル秘ワザ  無断転載禁止

    ブログパーツ