- ベストアンサー
googleマイマップをHPに
googleマップの『マイマップ』を「iframe」を使ってHPに埋め込もうと思っています。 大元の(マイマップを埋め込んである)ページにリンクを設置し、地図中のマーカーを移動させることは可能でしょうか? また、その逆にマーカーにリンクを付けてお大元のページ内容だけを変更させることは出来るでしょうか? 詳しくはこんな感じです http://www.youtube.com/watch?v=5bHSuPOa_Ko&feature=youtu.be ↑動画で説明しています↑ わかりづらいかもですが、よろしくお願いします。
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
なら、できますよ。 iframeは、リンクのターゲットになりうるので、<a href="[URL]" target="[frameName]">どこ</a> と・・ hrefの内容は、iframeのsrcの内容を書く。 ★この掲示板の仕様でソースが切れてしまうためhtt:はhttp:に変換してあるので戻すこと <p> <iframe width="425" height="350" name="MAP" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.jp/maps?f=q&source=s_q&hl=ja&geocode=&q=%E6%9D%B1%E4%BA%AC%E9%A7%85&aq=&sll=34.170997,132.22245&sspn=0.009711,0.013797&brcurrent=3,0x60188c0c0b13f54d:0xb630953beee48188,0&ie=UTF8&hq=&hnear=%E6%9D%B1%E4%BA%AC%E9%A7%85%EF%BC%88%E6%9D%B1%E4%BA%AC%EF%BC%89&t=m&z=14&ll=35.681382,139.766084&output=embed"></iframe> </p> <p> <a href="http://maps.google.co.jp/maps?f=q&source=s_q&hl=ja&geocode=&q=%E6%9D%B1%E4%BA%AC%E9%A7%85&aq=&sll=34.170997,132.22245&sspn=0.009711,0.013797&brcurrent=3,0x60188c0c0b13f54d:0xb630953beee48188,0&ie=UTF8&hq=&hnear=%E6%9D%B1%E4%BA%AC%E9%A7%85%EF%BC%88%E6%9D%B1%E4%BA%AC%EF%BC%89&t=m&z=14&ll=35.681382,139.766084&output=embed" target="MAP">東京駅</a> </p> <p> <a href="http://maps.google.co.jp/maps?f=q&source=s_q&hl=ja&geocode=&q=%E6%B1%A0%E8%A2%8B%E9%A7%85&aq=&sll=35.681382,139.766084&sspn=0.038136,0.055189&brcurrent=3,0x60188d5bb9d45c6b:0x4f1c44deaf8c4d77,0&ie=UTF8&hq=&hnear=%E6%B1%A0%E8%A2%8B%E9%A7%85%EF%BC%88%E6%9D%B1%E4%BA%AC%EF%BC%89&t=m&z=14&ll=35.728926,139.71038&output=embed" target="MAP">池袋駅</a> </p> <p> <a href="http://maps.google.co.jp/maps?f=q&source=s_q&hl=ja&geocode=&q=%E4%B8%8A%E9%87%8E%E9%A7%85&aq=&sll=35.728926,139.71038&sspn=0.019056,0.027595&brcurrent=3,0x60188e9e8b28ebb3:0x9bba88ca3db2f4be,0&ie=UTF8&hq=&hnear=%E4%B8%8A%E9%87%8E%E9%A7%85%EF%BC%88%E6%9D%B1%E4%BA%AC%EF%BC%89&t=m&z=14&ll=35.713768,139.777254&output=embed" target="MAP">上野駅</a> </p> iframeの使用方法がわからなかったのですか? ⇒16.5 行内フレーム: IFRAME要素( http://www.asahi-net.or.jp/%7Esd5a-ucd/rec-html401j/present/frames.html#h-16.5 ) のtarget属性を使用します。 サイズ変更とかがないのでしたらobject要素を使用するほうが良いでしょう。strictで作成できます。
その他の回答 (2)
- fujillin
- ベストアンサー率61% (1594/2576)
マップを埋め込むよりも、APIを利用して表示する方法のほうがご質問のようなことはやりやすいと思います。 「iframe」が必須なのかが不明ですが、iframeでなく直接表示するほうが簡単だと思います。 リンクで移動する部分だけの例ですが… http://okwave.jp/qa/q7908345.html マーカーや吹き出し表示をコントロールする例 http://okwave.jp/qa/q7894323.html 好きなように使い倒すにはこちらを理解する必要が… https://developers.google.com/maps/documentation/javascript/reference サンプルの使用例がこちらに沢山ありますので、どのようなことができるのかを見るには手っ取り早いかも https://developers.google.com/maps/documentation/javascript/demogallery
お礼
ですね。1からAPIの使い方などを勉強したほうが良いのかも知れませんね。 色々調べていただいてありがとうございます。
- ORUKA1951
- ベストアンサー率45% (5062/11036)
始めは意味がわかりませんでした。 HTMLで書かれているウェブページにiframeでgooglemapを埋め込めるかと言うことですね。 HPとはヒューレッドパッカードのことですからHPと略してはなりません。 ホームページトはブラウザを起動したときに最初に表示されるページです。 「googleMapをホームページにする」だと、ブラウザでgooglemapを表示させて、「このページをホームページにする」で一発で解決します。 もし、類推どおり「ページに埋め込む」のでしたら、 ⇒iframe googlemap ページに埋め込む - Google 検索 ( https://www.google.com/#hl=ja&gs_rn=1&gs_ri=hp&tok=GRk6PyzslsF64omRpDrK1A&pq=iframe%20googlemap&cp=25&gs_id=1hf&xhr=t&q=iframe+googlemap+%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AB%E5%9F%8B%E3%82%81%E8%BE%BC%E3%82%80&es_nrs=true&pf=p&safe=off&tbo=d&sclient=psy-ab&oq=iframe+googlemap+%E3%83%9A%E3%83%BC%E3%82%B8%E3%81%AB%E5%9F%8B%E3%82%81%E8%BE%BC%E3%82%80&gs_l=&pbx=1&bav=on.2,or.r_gc.r_pw.r_qf.&bvm=bv.41642243,d.dGY&fp=e753b335a47826ee&biw=1024&bih=639 ) で検索すれば、たくさん情報があります。具体的な方法はそちらを参照されるほうが良いでしょう。
補足
HPはダメですか? 私の周りではそう記述する人が多かったので。 今後は控えるようにします。 まぁ、それはおいておいて・・・ 折角お答えいただきましたが、全く私の質問の意図と違う答えです。 私は、ただ設置したいわけじゃないんです。 その位なら出来ますので。 内容をよく理解した上で、私のやりたい事が出来る方法を教えて下さい。 説明動画は見てもらえたのでしょうか? ただ、「ホームページに埋め込めるか?」 という質問ではありませんので!! よろしくお願いします。
お礼
あぁ、こんな感じです。 ここまで戴ければ、後はなんとか・・・ 出来るといいなぁ。。。 頑張ってみます。 お手数おかけしました。ありがとうございます。