Google mapをサイトに掲載したい場合、iframeなどのコードをGoogle mapで取得できる。
しかし、携帯サイトやスマートフォンに掲載すると、これではちょっと重いので、そのような場合はGoogle Staticd Maps APIを使うとよさそう、ということを以前の投稿で述べていました。
最近、実装する機会がありましたので・・・
<img src="http://maps.google.com/maps/api/staticmap?zoom=15&size=500x250&maptype=roadmap\ &markers=size:mid%7Ccolor:red%7C東京都墨田区押上1丁目1-2&sensor=false" width="500" />
クエリを解説すると
- zoom=15 : 拡大率(?)
- size=500×250 : 表示サイズ
- maptype=roadmap\ :地図のタイプ(値は、roadmap、satellite、hybrid、terrain など)
- markers=size:mid%7Ccolor:red%7C東京都墨田区押上1丁目1-2 : 指定した場所につけるマーカー
- パイプ(%7C)でパラメータを設定することができます。
- この例は、マーカーサイズ、マーカーの色、マーカーの位置
- マーカーの位置は住所(もしくは緯度経度)で指定します。
- sensor=false : ユーザーの位置情報を取得
これを表示すると
上記のとおり画像として掲載してくれます。簡単ですね。
詳細は本家を参照
https://developers.google.com/maps/documentation/staticmaps/?hl=ja#Mobile