Google Sites で Google マップを埋め込む

Google Sites ではガジェットをページに埋め込むことができる。

1. edit page ボタンを押す
2. Insert > More… を選択

「公式 Google ガジェット」として、「地図」があったので、Google マップを表示させるために利用しようと思ったが、設定しても地図が表示されなかった。 (+_+)

Google Sites Help Group で map について調べたら、Putting Google map on the site via api + .js - How-to for End Users でマップを埋め込んでいる方がいた。

 

方法

以下、Inserting custom gadgets in Google Sites. (grinsted) の説明に従った。まず、上記に書いたように Google Sites においてガジェットを埋め込む手順を行う。 「URL を指定して追加」のリンクをクリックすると、URL を入力するためのフィールドが表示されるので、以下の URL を入力する。

http://grinsted.googlepages.com/flexiblegadget.xml

 

Setup your gadget ダイアログが表示されるので、表示したい地図の iframe url を入力して OK ボタンを押す。

 

ただし、 ifarme url は次のように取得した。

まず、Firefox 上で Google マップを右クリックしたときに、コンテキストメニューが表示されるように設定を変更。「ツール > オプション > コンテンツ」 において、JavaScritpt の「詳細設定」のボタンを押す。「コンテキストメニューを無効化または変更する」のチェックをはずす。

 

Google マップにおいて、表示したい位置を特定する。地図の右上、「リンク」をクリックし、「埋め込み地図のカスタマイズとプレビュー」を選択。

 

表示された地図の上で右クリック > 「このフレーム > このフレームだけを表示」を選択する。これにより地図だけがウィンドウいっぱいに表示されるので、このときの URL をコピーし、上記の iframe url に設定する。

追記(2008.8.24) : 上記の「このフレーム > このフレームだけを表示」では URL が表示されなくなってしまった。そこで「このフレーム > フレームを新しいウィンドウで開く」を選択することによって URL を表示させるようにした。

追記 2 (2008.8.24) : Google マップのマイマップを Firefox で開き、上記の通りの操作をしようとしたが、マイマップで使用したアイコンが表示されるのが非常に遅かった。そこで、マイマップの URL を控えておき、Google からサインアウトした後に、再度マイマップを開くと今度はスムーズにアイコンを含めて開くことができた。

関連サイト

• Flexible Gadget