グーグルマップをホームページに簡単に表示する方法

グーグルマップをホームページに簡単に表示する方法

　ビジネスホームページでも、グーグルマップを利用しているのをよく見るようになりました。
　今回は、グーグルマップの静止画を簡単に表示できるサービスをご紹介します。

　英語のホームページですが、検索は日本語でも利用できるので、簡単に設定することが可能です。

　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では、「&」と記述することをすすめられています。
　きちんと表示されますが、気になる方は変更してください。