アファメーションで独立・起業・夢実現。「いきなり!社長宣言!!」-“夢は口に出すことで実現する!”というアファメーション:ライブラリー

2010年5月28日

Googlemapsでバルーン(吹き出し)を非表示にする(消す)方法。

夢実現のアファメーションを実践する起業家にもっとも読まれているブログは?

地図は必要でしょ?

ウェブサイトを制作するにあたって、リアルビジネスをしているお客さんの場合、どうしても避けて通れないのが、地図の表示。

本来であれば、それぞれのサイトごとに、そのサイトにあったデザインで画像を作るのが基本ですが、なかなかコストの関係でそこまで手が回らないクライアントさんがいるのも事実。
(とくに中小企業の方々は...このご時世ですからね。汗)

そんなときに便利なのがGoogleMaps(グーグルマップ)です。

...って、いまさらですがw

GoogleMapsは導入がカンタン!

たぶん、ネットを使っている人であれば、地図検索=GoogleMapsというぐらい当たり前の存在になってきてますよね。

その会社やお店などの正確な地図が得られるので、実はエンドユーザーにとっても、サイトのデザインに合った「わかりにくい地図」よりも便利だったり...w

さらに、Googleが用意しているAPIを利用することで、ルートの表示やピンのデザイン変更など、かなり詳細にカスタマイズをすることができます。

カスタマイズなんてしなくても、「とにかくわかりやすい地図が欲しい!」というだけであれば、GoogleMapsで住所で検索をして、表示された地図の貼り込み用のURLをサイト内に組み込めば、それだけでマップを表示することができます。
(iframeで貼り込むカタチなので、それがいやな方はダメですが...)

んが。

そこでちょっと問題が。

地図を検索すると、その場所にピンが立って、住所などがバルーン(吹き出し)表示されますが、ページに組み込む地図のサイズが小さい場合、バルーンで周りが隠されてしまって、地図として役に立たない...という状態になってしまいます。

先の「API」を使ったり、JSを駆使することでバルーンの表示を消すことはできるんですが、もっと簡単な方法はないか?

...ということで、前置きが長くなりましたが、あります。

Googlemapsでバルーン(吹き出し)を非表示にする(消す)方法。

やり方はめちゃくちゃカンタンです。

地図検索で取得した貼り込み用のコードにあるiframeのsrc部分にパラメータとして「iwloc=B」を加えるだけです。
※追記参照

具体的には下記のような感じ。

<iframe src="~&amp;output=embed"></iframe>...

の「~」の末尾を

<iframe src="~&amp;output=embed&amp;iwloc=B"></iframe>...

とする。(別に途中でもいいんだけど、末尾の方がわかりやすいでしょ?)

大げさにマップをカスタマイズする必要もなく...でも、GoogleMapsは使いたいんだけど、バルーン(吹き出し)がじゃまだーっ!!という方は、ぜひご参考に。

追記:10/12/17

iframeのソースをよく見たらその中に「&amp;iwloc=A」という部分があった。なので、その値をA⇒B(&amp;iwloc=B)とすればOKです。

この記事に関連する(かもしれない)書籍

 

投稿者 kuro : 2010年5月28日 22:19 | ID:828

ページトップ△

ページトップ△