iscle [イズクル] - あなたの生活に役立つネタを!

Googleマップのカスタマイズが4ステップで簡単にできる無料ツール

竹中文人
執筆者:
[最終更新日]2013/12/19
[カテゴリ]Web・IT

Googleマップをオリジナルにカスタマイズホームページに地図を挿れるとき、多くのホームページでGoogleマップが利用されています。無料で簡単に地図を表示させることができる上、分かりやすくスマホとの連携もしやすいのでとても便利ですね。

確かに簡単に地図を挿れることができるのですが、自分らしくカスタマイズしたいと思ったことはありませんか?例えば目的地に表示されるこのアイコン 初期アイコン を別のアイコンやオリジナルの画像に変更したり、目的地の詳細情報や写真を自由に追加したりできれば、より分かりやすく便利になります。

Googleマップのカスタマイズにはプログラムの知識がないと難しい部分が多いのですが、無料ツール『0円のマップ屋さん』を利用すれば4ステップで簡単にカスタマイズができます!
『0円のマップ屋さん』http://www.egmap.jp/create.htm

ステップ1

ステップ1は目的地の場所を検索します。住所や著名な施設名で検索するか、地図上のアイコンを任意の場所にドラッグして指定することも可能です。
目的地の検索

ステップ2

ステップ2は地図の大きさ・マウスホイールで拡大縮小するか・吹き出しを最初から表示させるか・位置表示アイコンの設定を行います。注目は位置表示アイコンを簡単に変更できる点ですね!オリジナル画像をアイコンに使いたい場合はサーバーに画像をアップしておき、その画像の絶対URLを記入します。
位置表示アイコンを変更できる

ステップ3

ステップ3は吹き出しの内容(目的地の詳細情報等)を設定します。施設名や住所・URL・メールアドレス等を入力することができ、さらに位置表示アイコンと同様にオリジナルの画像を追加することが可能です。「HTMLタグで自由に生成する場合はコチラ」をクリックすれば吹き出しの内容をHTMLベースで設定ができるので、HTMLが分かる方はより自由に設定が可能です。
目的地の詳細情報

ステップ4

ステップ3までで設定した内容を「地図の表示を確認」で確認して問題なければ、ホームページに貼り付けるためのタグを取得します。「地図のタグを作成」をクリックするとタグが表示されるので、全てのタグをコピーしてホームページの表示させたい場所に貼り付けてください。
コードの作成

これでオリジナルの地図が表示されるはずです!
オリジナルGoogleマップの表示