英語表記のGoogle Mapをホームページに表示する。(埋め込む)~備忘録〜

プログラミング

やりたいこと

英語表記のGoogle Mapをホームページに表示する。

当社では学術集会・国際会議のお手伝いの1つとして、学術集会・国際会議をご案内するためのホームページを作成しています。ホームページでほぼ必須となるのが、開催地や開催施設までのアクセスや地図の表示です。開催地周辺の空港や主要駅からの路線図や簡易マップなどの画像作成に加え、世界中の多くの方が利用されているGoogle Mapをホームページに埋め込む場合があります。

当然ですが、日本国内の場所をGoogle Mapでホームページに埋め込んだ場合、地図上の表記はすべて日本語になります。しかし、国際会議の場合、外国人の方もいらっしゃるため、ホームページに埋め込んだGoogle Mapを英語表記にする必要があります。今回はホームページに埋め込むGoogle Mapを英語表記にする方法を備忘録として残したいと思います。

日本語表記埋め込みHTMLの取得

インターネットで検索すれば、やり方を示したサイトが山のようにありますが、念のため日本語表記となる通常のGoogle Mapの表示からご紹介します。

まずはブラウザでGoogle Mapを表示し、目的地を検索します。目的地が表示されたら、「共有」をクリックします。

共有ウィンドウが表示されますので、「地図を埋め込む」タブを選択します。地図のサイズを選択し、「HTMLをコピー」をクリックします。

そうすると下記のようなHTMLがコピーをされます。

<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3241.056922257235!2d139.74502965914894!3d35.6756003732931!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188b89b2e1b089%3A0x48c7d4fa5e528690!2z5Zu95Lya6K2w5LqL5aCC!5e0!3m2!1sja!2sjp!4v1647759220838!5m2!1sja!2sjp" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>

Google Mapの表示(日本語)

HTMLをホームページ上に貼り付けるとGoogle Mapが表示されます。

これはブラウザの言語設定を英語にしても日本語で表示されます。英語表記にするために1つだけ設定を変更します。

英語表記HTMLの取得

ここから英語表記のGoogle Mapの表示方法となります。まずは日本語の場合と同様にブラウザでGoogle Mapを表示します。左上の3本線アイコン(ハンバーガーアイコン)をクリックします。

各種メニューが表示され、下部にある「言語」をクリックします。そうすると言語設定ウィンドウが表示されますので、今回は「English (United States)」を選択します。

Google Mapの画面が英語表記になりました。ここからは日本語の場合と同じで、「Share」(日本語の場合、「共有」)をクリックします。

Shareウィンドウが表示されますので、「Embed a map」タブを選択します。地図のサイズ(Medium等)を選択し、「COPY HTML」をクリックします。

そうすると下記のようなHTMLがコピーをされます。日本語の場合に比べどこが異なるか、わかりませんがこれで英語表記のGoogle Mapになります。

<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d3241.0569211726392!2d139.7450297!3d35.6756004!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188b89b2e1b089%3A0x48c7d4fa5e528690!2sNational%20Diet%20Building!5e0!3m2!1sen!2sjp!4v1647760182119!5m2!1sen!2sjp" width="600" height="450" style="border:0;" allowfullscreen="" loading="lazy"></iframe>

Google Mapの表示(英語)

HTMLをホームページ上に貼り付けると英語表記のGoogle Mapが表示されます。

まとめ

いかがだったでしょうか?簡単に英語表記のGoogle Mapをホームページに表示させることができました。ホームページを閲覧している方のブラウザの言語設定に伴い自動で、Google Mapの言語も変わってくれれば楽なのですが、そうはならないようです。日本語以外のホームページ作成時は、言語変更をしてGoogle Mapを表示する必要があります。私はうっかり言語変更を忘れ、日本語のままGoogle Mapを表示してしまいそうだったので、今回の備忘録とさせていただきました。皆様のお役に立てば、幸いです。