グーグルマップを埋め込むときに、デザイン的に吹き出しが邪魔になることがありませんか。でも、吹き出しは、コードを少し改変するだけで、あっという間に消えます。
普通に貼り付けると…
グーグルマップのリンクアイコンをクリックすると、以下のうようなコードが生成されます。
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.jp/maps?hl=ja&safe=off&q=%E4%BC%8A%E8%B3%80%E4%B8%8A%E9%87%8E%E9%A7%85&ie=UTF8&hq=&hnear=%E4%BC%8A%E8%B3%80%E4%B8%8A%E9%87%8E%E9%A7%85%EF%BC%88%E4%B8%89%E9%87%8D%EF%BC%89&gl=jp&t=m&z=13&brcurrent=3,0x600155c6088f3519:0xe9a4f662c07ad725,0&ll=34.789043,136.123585&output=embed"></iframe>
<br />
<small>
<a href="http://maps.google.co.jp/maps?hl=ja&safe=off&q=%E4%BC%8A%E8%B3%80%E4%B8%8A%E9%87%8E%E9%A7%85&ie=UTF8&hq=&hnear=%E4%BC%8A%E8%B3%80%E4%B8%8A%E9%87%8E%E9%A7%85%EF%BC%88%E4%B8%89%E9%87%8D%EF%BC%89&gl=jp&t=m&z=13&brcurrent=3,0x600155c6088f3519:0xe9a4f662c07ad725,0&ll=34.789043,136.123585&source=embed" style="color:#0000FF;text-align:left">大きな地図で見る</a>
</small>
これを貼り付けると以下のような地図になり、吹き出しがちょん切れて、デザイン的には相当アレなページが出来てしまいます。
吹き出し削除は簡単
この邪魔な吹き出しを排除するのはとても簡単です。上のコードの中から、
&output=embed">
</iframe>
という部分を見つけて、
&output=embed&iwloc=B">
</iframe>
に置き換えるだけです。
これで吹き出しが見事に取れます。
実際に改変したコード
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.jp/maps?hl=ja&safe=off&q=%E4%BC%8A%E8%B3%80%E4%B8%8A%E9%87%8E%E9%A7%85&ie=UTF8&hq=&hnear=%E4%BC%8A%E8%B3%80%E4%B8%8A%E9%87%8E%E9%A7%85%EF%BC%88%E4%B8%89%E9%87%8D%EF%BC%89&gl=jp&t=m&z=13&brcurrent=3,0x600155c6088f3519:0xe9a4f662c07ad725,0&ll=34.789043,136.123585&output=embed&iwloc=B"></iframe><br /><small><a href="http://maps.google.co.jp/maps?hl=ja&safe=off&q=%E4%BC%8A%E8%B3%80%E4%B8%8A%E9%87%8E%E9%A7%85&ie=UTF8&hq=&hnear=%E4%BC%8A%E8%B3%80%E4%B8%8A%E9%87%8E%E9%A7%85%EF%BC%88%E4%B8%89%E9%87%8D%EF%BC%89&gl=jp&t=m&z=13&brcurrent=3,0x600155c6088f3519:0xe9a4f662c07ad725,0&ll=34.789043,136.123585&source=embed" style="color:#0000FF;text-align:left">大きな地図で見る</a></small>