スクショNG！Googleマップをブログやサイトに埋め込むカンタンな方法

おすん

フリーランスデザイナーのおすん（ @osunnotsubuyaki）です。

お店などの地図を紹介する際にGoogleマップを使用する機会も多いと思います。

ただ、Googleマップをブログやサイトに表示させる際にスクショすることはNGってご存知でしたか？

意外と知らずにスクショされてるブログも多いですが、この記事ではGoogleマップを簡単に埋め込むことができる方法をご紹介します。

この記事の内容

Googleマップをスクショで表示させるのはNG！
Googleマップをホームページに埋め込むカンタンな方法
地図画像を編集＆貼り付けするならOpenStreetMap
Googleマップをブログやサイトに埋め込むカンタンな方法まとめ

Googleマップをスクショで表示させるのはNG！

Googleマップのスクリーンショットを貼り付けて大丈夫なのか？という疑問がありますが、実はこれはNGなんです。

Google Map利用規約がありますが、書いてあることが難しくてよく分かりづらいのでマップヘルプというとこにわかりやすく解説していたのでこちらで確認したほうがわかりやすいです。

→ マップヘルプ

マップヘルプ一部引用

他のユーザーとマップやルートを共有する

他のユーザーと場所、ルート、地図を共有できます。共有できる情報は以下のとおりです。

場所、ビジネス情報、住所

ルートの検索結果

ストリートビューの画像

以下の情報は共有できません。

保存した場所を含む地図（自分専用のため）

距離測定の結果を含む地図

地図そのもののスクリーンショットや画像

上記はマップヘルプを引用したものですが、『以下の情報は共有できません』のリストに、地図そのもののスクリーンショットや画像とあるので、スクショはNG（おそらく著作権違反）ということがわかります。

ですが次で解説する「埋め込み」の機能を使えば何の問題もありません。

Googleマップをホームページに埋め込むカンタンな方法

① 埋め込みたい地図（住所）をGoogleマップで表示させる

まずはGoogleマップで表示させたい地図の場所（住所）を入力します。

左上部分に「 googlejapan 」と入力

おすん

この記事では、例として「 Google Japan 」の住所を表示させてみます。

② 「共有」ボタンを押します

次に共有ボタンをクリックします。

「共有ボタン」を押す

すると共有方法（リンクを送信する or 地図を埋め込む）が選択できます。

今回は「地図を埋め込む」を選択しましょう。

「地図を埋め込む」を選択

③ 地図の大きさ（表示サイズ）を調整します。

4種類ある地図の大きさを調整

埋め込む地図の縦横サイズを決めましょう。

「小」「中」「大」「カスタムサイズ」の4種類から選択が可能です。

地図サイズ一覧

「小」… 横400px × 縦300px
「中」… 横600px × 縦450px
「大」… 横800px × 縦600px
「カスタムサイズ」…自由に数字を入力

おすん

地図のズームレベルを調整したい場合は、「CTRLキーを押しながらマウスホイール」で可能です！

④ 「埋め込みコード」をコピーします

「 HTMLをコピー」をクリックする

下記の「Google Japan」の埋め込みコードをブログやサイトにHTMLで入力すると地図として表示されます。

<iframe src=”https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3241.6691290325202!2d139.7270927155546!3d35.66052273871438!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188b770913970d%3A0xccc3467fcb15b353!2zR29vZ2xl5ZCI5ZCM5Lya56S-44O75YWt5pys5pyo44Kq44OV44Kj44K5!5e0!3m2!1sja!2sjp!4v1583486132160!5m2!1sja!2sjp” width=”600″ height=”450″ frameborder=”0″ style=”border:0;” allowfullscreen=””></iframe>

⑤ 「埋め込みコード」をペーストします

上記のHTMLをコピーしたものをペーストすると下記のようにGoogleマップが表示されるはずです。

中サイズで表示したGoogleマップ

以上5つの手順でGoogleマップの埋め込みは終わりです。

慣れれば1〜2分でできます！

地図画像を編集＆貼り付けするならOpenStreetMap

マップに経路を書き込みたい場合もありますよね？

地図画像を編集＆貼り付けするならOpenStreetMapというツールを使えば問題ないです。

OpenStreetMapは誰でも自由に利用することができ、なおかつ編集機能のある世界地図を作る共同作業プロジェクトです。

OpenStreetMap 公式サイト

OpenStreetMap のクレジット表記の仕方

“© OpenStreetMap contributors”のクレジットを必ず使用してください。

あなたはデータが Open Database License に基づいて提供されていること、そして地図タイルを使用する場合は、地図画像が CC BY-SA としてライセンスされていることを明確にしなければなりません。著作権表示ページにリンクすることでこれを表現することができます。また、データの形式でOpenStreetMapを配布する場合の要件として、名前を表示の上、ライセンスに直接リンクすることができます。リンクを張れないメディア（印刷など）の場合は、openstreetmap.org（OpenStreetMapをアドレスとして展開した形）、opendatacommons.org、さらに関連がある場合はcreativecommons.orgへ読者を誘導することをお勧めします。