Web blog WEBブログ

サイトに埋め込んだGoogleマップの縮尺を変更する方法

2019.03.11

こんにちは。コーダーの兼山です。

サイトに埋め込んだGoogleマップの縮尺を変更する方法をご紹介します。

GoogleMapの埋め込みについてはAPIを使う方法もありますが、今回は、iframeタグでの埋め込みで説明します。

サイトに埋め込んだGoogleマップの縮尺を変更する

※岐阜県庁を例にします。

岐阜県庁のマップ取得コードは以下の通り。

<iframe style=”border: 0;” src=”https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d828434.9852783473!2d136.40428839008672!3d35.79811264779371!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x6003aeeeeb1892d5%3A0x2cdffb16307033da!2z5bKQ6Zic55yM5bqB!5e0!3m2!1sja!2sjp!4v1553582912672″ width=”600″ height=”300″ frameborder=”0″ allowfullscreen=””></iframe>
上記コードの『!4f13.1』部分の『13.1』を任意の倍率に書き換えることで<iframe>で埋め込みをしたGoogleMapを拡大・縮小できます。
13.1は、1~180の間で変更可能。
数字が小さいほど倍率が高く、数字が大きいほど倍率が低くなります。

まとめ

ユーザビリティの面で役に立つと思います。
是非、ご活用ください。

兼山暖美

この記事を書いた人 兼山 暖美 エンジニア

無料相談窓口