• ベストアンサー

グーグルマップをHPに載せる方法

http://www.e-doctors-net.com/suginami/ishii/ こんな感じにするのは、どこにそのやり方が書いていますか? ブログではなくてHPに載せたいのですが・・ご存じの方教えていただければ助かります。 窓の杜 - 【NEWS】任意のお店を“Google マップ”上に表示できるHTMLファイルを自サイト用に作成 http://www.forest.impress.co.jp/article/2005/09/12/googlemap... このソフトを使う意外で教えてください。このソフトはうまくいきませんでした、

  • HTML
  • 回答数1
  • ありがとう数0

質問者が選んだベストアンサー

  • ベストアンサー
  • suzukikun
  • ベストアンサー率28% (372/1325)
回答No.1

この辺でしょうか? けっこうJavascriptとか、Web APIとか知らないと辛いかも知れません。 書籍も出ていますので確認してみてください。

参考URL:
http://www.rfs.jp/sb/javascript/10/googlemaps.html

関連するQ&A

  • google mapの地図上の緯度、経度を知ることは・・

    google map上で任意の場所の緯度、経度を知ることはできますか? また、それを知ることができたとして、その値をgooglemapに渡して地図を表示させることができますか? やりたいことは、住所がまだ暫定処置になっているところは住所指定でgooglemapで引き出せない場合や、引き出せても少しずれている場合があるため緯度、経度を地図から読み出せれば上述のことが可能になるのかなと考えました。宜しくお願いします。

  • GOOGLE MAPをHPで使用する際

    こんばんわ。 お世話になります。 現在、自分でHPを作っている最中で、そのHPにGOOGLE MAPを所在地地図の欄に使いたいのですが、GOOGLE MAPをHPで使用する際のことについて、2.3質問させて下さい。 HPはXHTMLで、文字コードは、Shift_JIS で作っております。 下記のHPを利用させて頂き、GOOGLE MAPのソースを作り ttp://www.geekpage.jp/web/google-maps-api/gmapcreator/ 自分のHPに追加したのですが、 自サイトの文字コードは、Shift_jISで追加したGOOGLE MAPは、UTF-8ですが一つのページに文字コードが二つあるのですが、これは宜しいのでしょうか。 ソース内のtype="text/javascript" charset="utf-8"の部分を"Shift_JIS"に変えましたが、うまく行きません。 また、GOOGLE MAPのソースをHP内思ったところに配置する際には(CSSまたは、HTML内に)どのように記述すれば良いのでしょうか。 ど素人な質問で恐縮ですが、ご教示よろしくお願い致します。

  • Google Mapについて教えてください

    NEXUS7(2013)の初心者です(東海地方在住)。 お江戸日本橋から旧中山道を歩くつもりでNEXUS7を購入しました。 タブレットPC片手に歩けば道に迷わずにすむのでは?という考えです。(中山道ですから基本的には国道17号線ですが、かなり横道への出入りがあるのです) PC歴は長いのですが、スマホをいじったこともなく、操作に不慣れでNEXUS7相手に苦戦中です。 買い求めたのはNEXUS7(2013)WiFi 32GBモデルです。 オンラインの必要がある場合はコンビニやホテル(夜)などでWiFiに接続しようと考えています。 地図ソフトはGoogle Mapを使用する予定です。(オフラインに対応する地図ソフトもありますが、有料のため使いたくない。出費を抑えたい)。 さて、前置きが長くなって恐縮です。 そのGoogle MapをNEXUS7で使う場合、下記について教えてください。 (1)自宅で東京の地図を見ていると、ところどころ「粗い」個所が出てきます。当然、その部分では詳細地図が表示されません。自宅周辺(東海地方)でも所々粗いところがあります。GoogleMapはこんなものでしょうか? 原因は何でしょうか。 何か回避策がありますか? (2)中山道のルートに星マークのブックマークをプロットして道案内にするつもりです。 そのブックマークですが、間違えたものを削除するにはどうしたらよいでしょうか? (3)私のような用途に向く使い方、あるいは他の地図ソフト(無料かごく低額の)をご存じなら教えてください。 以上、よろしくお願いします。

  • グーグルマップで矢印やURLは?

    実は私の場合、自分でもブログ(FC2)を作ってるんですが 其(そ)のブログにグーグルマップを載せたい為 方法が知りたいと言う質問です 詳細ですが、場所を紹介するのに 特定の場所で、マップに目印を付けて地図を載せたいのと 更にはストリートビューの画像も付けたいと思います しかし…グーグルマップは最近(?)仕様変更された様で 例えばURLでも、以前は鎖の様なアイコンをクリックすれば 埋め込みが表示出来ましたが、今は其れが見つかりません ちなみに私の使い方は ブラウザはFirefoxなんですが ネットを閲覧中に特定の文字をドラックし 右クリックするとグーグルの検索項目が出るんで 其れをクリック… するとグーグルの検索画面が出る為 其処で検索窓に住所を入れて地図をクリックすると グーグルマップにアクセス出来ました 余談ですが、此の方法でアクセスした理由は 右クリックから検索画面を出した方が 使い易かったからです ただ…今試したんですが 最初からグーグルの検索画面のトップ https://www.google.co.jp/webhp?hl=ja を出しても結果は同じでしたから画面は変わりません しかし現在は、此の方法で地図を出しても レイアウトが変わってる為、 地図上で印を付けての埋め込みを出す方法も ストリートビューで埋め込みを出す方法も分かりません

  • googleウェブマスターツールでブログのサイトマップ

    googleウェブマスターツールを使い、ブログのサイトマップを登録しようとしています。metaタグをHTMLに記述しサイトの確認まではできたのですが、サイトマップ(xml)をブログにどうやってUPすればいいかわかりません。 FC2ブログですので http:ユーザー名.blog47.fc2.com/sitemap.xmlになるのですが、そもそもどうやってそこへUPすればいいかわかりません。サイトならば、自分でルートフォルダへUPできますがブログの場合はどうすればいいのでしょうか?

  • Googleマップが利用できなくなりました

    WindowsXP SP2、Firefox2.0.0.18の環境です。 いままで利用していたGoogleマップが利用できなくなりました。 状態は以下の通りです。 ・Googleマップのトップページにアクセスすると、一番上に「読み込み中・・・」と一旦表示された後、「読み込み中です...時間がかかる場合は、簡易Html版をお試しください」と表示されて動作が止まってしまいます。絵タイプ?の日本地図が表示されてスクロール、拡大縮小もできません。 ・簡易版は使用できます。 ・試しにIE6.0のほうでみてみると動作はするのですが衛星写真のほうの表示が以前に比べてかなり遅い気がします。 ・最近新たにインストールしたソフトなどはありません。 通常使用がFirefoxなので、この状態に困っています。 解決策があればお願いします。

  • 【HTML】形式のページを、「 Googleモバイルサイトマップ 」に登録する方法を教えて下さい。

    『ケータイサイト製作王2』というソフトで作った【HTML】形式のページを、「Googleモバイルサイトマップ」に登録したいのですが、ほとんど知識がないので理解できずに困っています。【HTML】形式のページを、「Googleモバイルサイトマップ」に登録する方法を教えて下さい。ちなみに、、、 「どのようなモバイル用マークアップ言語に対応していますか?」という質問に対して、「XHTML モバイル プロファイル (WAP 2.0)、WML (WAP 1.2)、および cHTML (iMode) に対応しています。 」という答えが書いてありました。また、 「携帯デバイスで表示するために作成した HTML ファイルがある場合、これらの URL をモバイル サイトマップで送信できますか?」とう質問に対して、「いいえ。現時点では、XHTML モバイル プロファイル、WML、および cHTML のマークアップ言語で作成された URL のみをモバイル サイトマップに含めることができます。 これは、Google の携帯サイト インデックスがこれらのマークアップ言語にしか対応していないためです。 携帯デバイスで表示するために作成された HTML ファイルは、Google のウェブ インデックスに登録されるため、 これらの URL を通常のサイトマップに含めて送信してください。」という答えがありました。

    • 締切済み
    • XML
  • RGM-3800でgoogle Map

    RoyalTek社のRGM-3800を持っている方はいませんか? いれば使い方を教えて欲しいのです。 トレッキングが好きなので、自分の歩いたところを記録しようと思い、GPSロガーなるものの存在を知って、各社色々ある中でRoyalTek社のRGM-3800が安い割に感度が良いという評判を見て買いました。 http://www.gpsdgps.com/product/pr_rt_rgm-3800.htm 確かに良さそうです。 試しに自宅の近所を歩いて、付属ソフトでパソコンに取り込んで、同じく付属ソフトのlocr GPS Photoで地図上に表示して見るところまではできました。 また、google Earth上にも歩いた軌跡を書くことができました。 ところが、次の2つの疑問があるのですが、お分かりになる方がいたらご教示くださいm(_ _)m 1.書かれた軌跡の一部を削除することができますか? つまり、A地点からB地点を通ってC地点まで行った記録があるとして、A-B間を残して、B-Cだけ削除する、といった使い方です。 2.locr GPS Photoとgoogle Earthではできたのですが、google Mapにも書けるはずですよね? そして友達にweb上で見せられると思うのですが、やり方が分からないです。 ↓こんなことをしたい。 http://cs3.c-able.ne.jp/cgi-bin/nkym/gps/index.shtml 「そして同軌跡を、GoogleMap上に表示したのが  こちら>>」の部分です。

  • Google MAPを子ウィンドウで表示

    あけましておめでとうございます。 いつもご相談させて頂き、恐縮でございます。 お手数ですが、下記のサイトをご覧ください。 http://horixx.80code.com/03/childwin2.html (AJAX Webアプリケーション アイデア ブックという本 のサンプルです) [東京]などをクリックすると子ウィンドウが立ち上がります。 -------------------------------------------------------- 私は、立ち上がった子ウィンドウに、Google Mapを入れ込みた いとチャレンジをしております。 -------------------------------------------------------- 子ウィンドウは、HTMLなら問題なく動くのですが、 javascriptなどは動作しません。 例:[javascript]をクリックした際、 基データである(http://horixx.80code.com/sample_DD.html) が動くはずですが、動作しません。 本題のgoogleMAPですが、表示すらされません。 なにかコツ、およびチャレンジされた方などいらっしゃいませ んでしょうか。

  • Googleマップ上で、オリジナルのマーカーを表示したい

    Googleマップ上で、オリジナルのマーカーを表示したい WEBサイトに表示しているミニ写真画像にマウスオーバーしたら、 Googleマップでマーカーを使ってその写真の場所を表示し、拡大写真も表示するようにしたいと思い、 下記のサイトを参考にして、作成しています。 http://ascii.jp/elem/000/000/421/421381/ Googleマップのデフォルトマーカーを使っては、希望通り、 上記のサイトのようなものができました。 ここで、表示する間隔が狭いので、わかりやすく、数字を振った オリジナルマーカーを使って表示したいと思うのですが、 それがうまくできません。 jisファイルは下記のように書いています。 $(function(){ var map = new GMap2(document.getElementById("gmap")); var firstData = $(".map:first").attr("longdesc").split(","); $("#googlemap").html("<img src=" + firstData[0] + ">"); var pos = new GLatLng(parseFloat(最初に表示する緯度),parseFloat(最初に表示する経度)); map.addOverlay(new GMarker(pos)); map.setCenter(new GLatLng(最初に表示する緯度, 最初に表示する経度), 15); map.addControl(new GSmallMapControl()); $(".map").mouseover(function(){ var shopdata = $(this).attr("longdesc").split(","); $("#googlemap").html("<img src=" + shopdata[0] + ">"); var markerIcon1 = new GIcon(); markerIcon1.image = "./img/flg-"+shopdata[3]+".png"; markerIcon1.iconSize = new GSize(20, 34); markerIcon1.iconAnchor = new GPoint(10, 34); var marker1 = new GMarker(new GLatLng(shopdata[1],shopdata[2]), markerIcon1); if($(this).attr("flag")) return; map.panTo(marker1, 9); map.addOverlay(marker1); $(this).attr("flag", true); }); }) HTMLのミニ画像を表示している部分は以下です。 <img src="./img/map-1.jpg" class="sekomap" longdesc="./img/map1-1.jpg,緯度,経度,マーカーに表示したい数字"> プログラムに間違いがあるかもしれませんが、 この状態ですと、エラーになって、オリジナルのマーカーも表示されないし、 ミニ写真の位置にも移動しなくなってしまいます。 どなたかご存じの方いらっしゃいましたら、教えてください。 色々調べましたが、もうお手上げ状態です。。(ToT)

    • ベストアンサー
    • AJAX

専門家に質問してみよう