締切済み

２つのinframeをまたいだJavaScriptの呼び出し

2009/12/07 13:20

１つのHTMLにiframeを２つ配置しています。片方のiframeにはGoogleMapが表示されています。もう片方のiframe内のリンクからonclickでGoogleMapを操作したいのですが、どのようにしたらできるでしょうか。宜しくお願いします。

dixam
お礼率83% (10/12)

JavaScript
回答数2
ありがとう数0

みんなの回答 （2）
専門家の回答

みんなの回答

yyr446
ベストアンサー率65% (870/1330)

2009/12/08 21:36 回答No.2

No.1です。なんとかうまくできました。片方のiframeで住所をクリックさせ、GoogleMapがあるiframeにロードした GMAP APIを使って、ジオコーディングとか地図移動、マーカー操作できました。 ======＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝親HTML <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja-JP"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Cache-Control" content="no-cache" /> <meta http-equiv="Expires" content="0" /> <title></title> <style type="text/css"></style> </head> <body> <iframe src="/IframeGmap02.htm" name="iframe2" id="iframe2"　width="640" height="200" ></iframe> <hr/> <iframe src="/IframeGmap01.htm" name="iframe1" id="iframe1" width="640" height="480" onload="iframe2.loadmap();"></iframe> </body> </html> ======＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝地図HTML <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja-JP"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Cache-Control" content="no-cache" /> <meta http-equiv="Expires" content="0" /> <title></title> <style type="text/css"></style> <script type="text/javascript" charset="UTF-8" src="http://maps.google.com/maps?file=api&v=2&key=自分のGoogleAPI KEY"></script> </head> <body> <div id="map1"></div> </body> </html> ======＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝操作HTML <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" lang="ja-JP"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta http-equiv="Content-Script-Type" content="text/javascript"> <meta http-equiv="Content-Style-Type" content="text/css"> <meta http-equiv="Cache-Control" content="no-cache" /> <meta http-equiv="Expires" content="0" /> <title></title> <style type="text/css"></style> <script type="text/javascript" charset="utf-8">  </script> </head> <body onunload="myBrother.GUnload()"> クリックした住所に移動して、情報ウィンドウ付きクリッカブルマーカーを配置する。<ul> <li><a href="javascript:void(0);" onclick="jump(this);">東京都千代田区1-1</a> <div>皇居です。<img src="about:blank" alt="皇居の写真"></div></li> <li><a href="javascript:void(0);" onclick="jump(this);">東京都中央区銀座1-1</a> <div>銀座です。<img src="about:blank" alt="皇居の写真"></div> </li> </ul> </body> </html>

ログインすると、全ての回答が全文表示されます。

yyr446
ベストアンサー率65% (870/1330)

2009/12/07 16:33 回答No.1

子フレームとか子Windowとか、別HTMLにあるGMAPオブジェクトの操作はなかなか、素直に出来ないんですよね。なるべく同じページ内の＜DIV＞要素をMAPキャンバスにして、なんとか工夫するべきなのですが．．．．どうしてもとゆうなら、子フレーム側にMAP APIをロードさせて、親から myChild=iframe1 ? iframe1 : document.getElementById("iframe1") ; map = new myChild.GMap2(myChild.document.getElementById("map1"), として、親からのAPIコールは全てmyChild.GMap2.～～みたいに呼び出せば出来るかも知れないとの事です（無保証）他の子フレームから呼び出す時は、さらに複雑になりそうだ。下記の記事をご参考に、 http://groups.google.com/group/google-maps-api-japan/browse_thread/thread/39624e358b2e0ba8?hl=ja#

ログインすると、全ての回答が全文表示されます。