グーグルマップをホームページに簡単に表示する方法
2008年3月4日(火)
ビジネスホームページでも、グーグルマップを利用しているのをよく見るようになりました。
今回は、グーグルマップの静止画を簡単に表示できるサービスをご紹介します。
英語のホームページですが、検索は日本語でも利用できるので、簡単に設定することが可能です。
Static Map Wizard
ためしに、札幌の「時計台」の地図を表示してみます。
「時計台」で検索すると、地図が表示されるので、左のボタンで位置や倍率を設定します。
表示サイズは、2項目で調整できます。
3項目でMaps APIのKEYを取得しなければならないため、「I agree to abide by the Maps API」にチェックし、表示するホームページのアドレスを入力すると、一番下に、地図画像のリンク先を表示されるので、imgタグで記述すると表示できます。
<img src="http://maps.google.com/staticmap?center=43.062526,141.353326&markers=43.062526,141.353326,red&zoom=13&size=500x300&key=ABQIAAAAnU6UbbsgXcXGuH9UtMqERBSLhHllL82gTNm47pTb6LoE-441_xS3vww41B2-gFKXkLMdMVkpWTv6sQ" alt="札幌時計台の場所" />
実際にソースに記述すると、次のように地図が表示されます。
地図のリンクアドレスを見ると、設定項目が「&」で区切られて含まれていることがわかります。
- center ･･･ 中心の座標
- markers ･･･ 緯度経度,マーカーの色
- zoom ･･･ 倍率（0～19）
- size ･･･ 画面サイズ（横×縦）
- key ･･･ Maps API Key
倍率や画面サイズを変更したいときは数字を変更してください。
座標、緯度経度は、最初からやり直したほうが良いと思います。
zoom（倍率）を、13から16に、マークを青に変更すると、下記のようにアップになります。
このように簡単に設定できますので、ビジネスに役立ててください。
アドレスに含まれる「&」ですが、HTML特殊文字のため、W3Cでは、「&」と記述することをすすめられています。
きちんと表示されますが、気になる方は変更してください。
TrackBack URL :
■最新の新着情報一覧
コメントはございません。