記事概要
Googleマップを活用し、地図を表示する方法について整理する
前提
- Googleアカウントにログインしていること
手順(既存住所)
- Googleマップにアクセスする
- 表示したい場所の住所を入力し、場所を選択する
- 共有ボタンをクリックする
-
地図を埋め込むを選択する - 地図サイズを指定したい場合は、
中から別の値に変更する
カスタムサイズの場合は、任意の大きさに指定できる -
HTMLをコピーをクリックし、HTML情報を取得する - Googleマップで取得したHTML情報をHTMLファイルに貼り付ける
<p> 東京駅 </p> <iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3240.831769147377!2d139.7644864753448!3d35.681144129979465!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188bfbd89f700b%3A0x277c49ba34ed38!2z5p2x5Lqs6aeF!5e0!3m2!1sja!2sjp!4v1765800656619!5m2!1sja!2sjp" width="800" height="400" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>
手順(カスタマイズ)
- Googleマイマップページにアクセスする
-
新しい地図を作成をクリックする -
CREATEをクリックする -
無題の地図を選択する - 地図のタイトルと説明を記述する
- 保存ボタンをクリックする
- 検索欄に表示したい場所の住所を入力し、場所を選択する
-
地図に追加をクリックすると、場所が確定する
- アイコンの色や種類を変更したい場合、
スタイルをクリックして設定を変更する
カスタムアイコンをクリックすると、アイコンを任意の画像に変更することも可能
- 地図全体のスタイルを変更したい場合、
基本地図をクリックし、スタイルを変更する
- 共有ボタンをクリックする
- 地図の公開範囲を設定するため、下記2つをチェックする
- このリンクを知っている人なら誰でも表示できる
- インターネットで検索しているユーザーにこの地図を公開する
- 閉じるボタンをクリックし、「地図の共有」を閉じる
- マイマップの右側にある3つの点をクリックする
-
自分のサイトに埋め込むをクリックする
- 表示されたHTML情報をコピーする
- 取得したHTML情報をHTMLファイルに貼り付ける