Googleマップの拡大率（縮尺）を微調整する方法【HTMLのみCSS不要】

Googleマップの拡大率（縮尺）を、細かく微調整する方法ない？

デザインカンプからのコーディングの際、アクセス方法などのページでGoogleマップがある事が多いですが、マップの拡大率がデフォルトのままだとデザイン通りにはならない場合があります。

そこで、今回はGoogleマップの拡大率（縮尺）を細かく微調整する方法をご紹介します。

じゅんぺいブログは、Web制作（コーディング・WordPress制作）の技術記事を中心に、約500記事公開しています。ぜひ他の記事も参考にしてみてください！

完全無料のプログラミングスクール『ZeroPlus Gate』

30日間でWeb制作を学べる無料のプログラミングスクールがこちら

いきなり数十万するプログラミングスクールは厳しい・・・という人のお試しに最適です。

現在は無料ですがいつ有料になるか分からないので、気になる方はお早めに👇
（有料になっていたらすいません🙇‍♂️）

＼完全無料／

ZeroPlus Gate公式サイト

毎日先着制！

Googleマップを埋め込む方法

最初に、Googleマップを埋め込む方法から解説します。

まずは、Googleマップを開いて地名か住所を検索します。

すると地図が表示されるので、次に『共有』をクリックします。

Googleマップ：埋め込み

すると次の画面で最初は『リンクを送信する』になっているので、『地図を埋め込む』を選択し、HTMLをコピーをクリックし埋め込み用のコードをコピーします。

Googleマップ：地図を埋め込む用のHTMLコードをコピー

あとは、そのコードをHTMLに貼り付ければOKです。

そして、埋め込んだ地図がこちらになります。

かろうじて東に原宿駅が見えますが、もう少し広くして周辺地域が見れるようにしてみたいと思います。

Googleマップの拡大率（縮尺）を細かく微調整する方法

Googleマップの拡大率を変更するには、埋め込み用のコードの一部を変更します。

その方法ですが、CSSは不要でHTMLだけ編集します。

まず、HTMLのコードを見てみましょう。

<iframe
 src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3241.219906589419!2d139.69451411567212!3d35.671586880196685!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x60188cb479620a33%3A0x34bcc78ce7f8bf3e!2z5Luj44CF5pyo5YWs5ZyS!5e0!3m2!1sja!2sjp!4v1607053443907!5m2!1sja!2sjp"
 width="600"
 height="450"
 frameborder="0"
 style="border:0;"
 allowfullscreen=""
 aria-hidden="false"
 tabindex="0">
</iframe>

この中に『4f13.1』と数値があります。