etc.

スポンサー広告

googlemapの挿入 ホームページにグーグルマップを張り付ける(簡易版)

2017/05/30

ホームページ作成(Webサイトの作成)をしていれば地図が必要になることがありますね。オリジナルで地図を作るという手がありますが、グーグルマップを張り付けるのが簡単でいいですし、閲覧者の方もズームしたり、土地勘のある所まで移動したりで便利かもしれません。

まずはグーグルマップを開きます。検索窓で表示したい場所に移動します。左上の三本線のボタンをクリックしてメニューを開きます。

グーグルマップ クラーク像

地図を共有または埋め込むをクリックします。

地図を埋め込む

ダイアログボックスが表示されますので地図を埋め込むをクリックします。地図のサイズが選択できますので任意のものを選択します。

マップのサイズを選択

選択したら、右のHTMLタグの部分をクリックします。選択状態になるのでコピーします。

HTML要素の選択 

以下のようなiframeがコピーされますので貼り付けます。

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d2918.0061667816167!2d141.39266271566737!3d42.99920470249018!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x5f0b2aa30d7e39e3%3A0x584055182ee24ce2!2z44Kv44Op44O844Kv5YOP!5e0!3m2!1sja!2sjp!4v1496126601634" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>

グーグルさん謹製のマップのタグなのですが、allowfullscreen属性やframeborder属性などが入っていますが、あまり気にしないでおきましょう。また、widthとheightがあるのでピクセル単位で変更することが可能です。

rssfeed
コメント

コメントよろしくお願いします。

お名前
コメント