- 締切済み
GoogleMapsAPIが表示されません
以下は、GoogleMapsAPIを表示させる部分のみを抜き取ったコードです。 これに併せてGoogleMapsDiretionsサービスを使った経路検索も設置してあります。そちらの経路選択は表示されるのですが、GoogleMapsAPIだけが表示されない現状です。 ・変数名の整合性 ・APIキー（v3は必要なし？） の2点は確認しました。 どうかアドバイスをお願い致します。 ------------↓コード部分↓（test.php）------------ <?php /*----------------------------------------------------------------------------- 概要 : : 作成者 : 作成日 : 更新履歴 : -----------------------------------------------------------------------------*/ // HTTPヘッダーで文字コードを指定 header("Content-Type:text/html; charset=UTF-8"); //--------処理部--------- //検索用クッキー削除 if(isset($_COOKIE["CoSrch"])){ setcookie("CoSrch", "", time() - 3600); } //--------処理部ここまで--------- ?> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <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" /> <title>設置サンプル</title> <link rel="stylesheet" type="text/css" href="css/gmapv3.css" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> $(function(){ var renderFLG=false; var directionsDisplay; var directionsService=new google.maps.DirectionsService(); var map,mode; var currentDirections=null; var startSpot="東京駅"; var endSpot="六本木ヒルズ"; initialize(); /* 地図初期化 */ function initialize() { var myOptions={ zoom:14, center: new google.maps.LatLng(35.670236,139.749832),//虎の門 mapTypeId: google.maps.MapTypeId.ROADMAP } /* 地図オブジェクト生成 */ map=new google.maps.Map(document.getElementById("map"), myOptions); if(!renderFLG) render(); calcRoute(startSpot,endSpot); } } </script> <style> #map { float:left; width:70%; height:100%; } #side { float:right; width:30%; height:100%; } #side .inner { padding:10px; overflow:auto; } </style> </head> <body> <h1>設置サンプル</h2> <p>「東京駅」から「六本木ヒルズ」までルートを検索し、右カラムにルート検索結果を表示します。 出発地点A・到着地点Bのマーカーをドラッグすると、それぞれの地点を変更されます。右カラムにあるボタンでルートの表示・非表示、プルダウンでトラベルモード（自動車、自転車、電車、徒歩）を切り替えられます。</p> <div id="map"><!-- 地図の埋め込み表示 --></div> <br clear="all" /> </body> </html>
- takigashira
- お礼率55% (15/27)
- JavaScript
- 回答数2
- ありがとう数14
- みんなの回答 （2）
- 専門家の回答
みんなの回答
- fujillin
- ベストアンサー率61% (1594/2576)
シンタックスエラーはNo1様の指摘の通りです。 （コピペのミスかもしれませんが、「(」が閉じていない） あとは想像ですが、ご提示のままだとすると <div id="map"><!-- 地図の埋め込み表示 --></div> は高さがなくなるので見えないため、表示されていないように感じるのではないでしょうか？ 例えば、高さを500pxのように指定してあげれば、見えるようになるかと思います。 あるいは、上位要素にもheigth:100%; を指定してあげるとか。
- kosukejlampnet
- ベストアンサー率44% (126/282)
エラー: SyntaxError: missing ) after argument list 行: 38 ただのシンタックスエラーですけど・・・。
関連するQ&A
- google map api のIE7の表示のバグについて教えてくださ
google map api のIE7の表示のバグについて教えてください。 google map api を実装したのですが、モダンブラウザとIE8では、問題無く表示されるのですが、IEではバージョンが7以下のブラウザでは、地図表示部分がグレーになってしまって全く表示されません。 IE6以下のブラウザは仕方無いとしても、IE7では正常に表示させたいのですが、どうしたらバグを解消できるか教えてください。 google map apiは、最新の「Version 3」を利用しました。 ソースは下記です。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>××</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="css/page.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> <script type="text/javascript"> google.maps.event.addDomListener(window, 'load', function() { var mapdiv = document.getElementById('map'); var myOptions = { zoom: ズーム, center: new google.maps.LatLng(緯度, 経度), mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true, }; var map = new google.maps.Map(mapdiv, myOptions); }); </script> </head> <div id="map"></div> いろいろなサイトを見て調べてやってみたのですが上手くいきませんでした。 お手数かけて申し訳ありませんが、ホームページ初心者なのでご指導いただければ助かります。 なにとぞよろしくお願い致します。
- ベストアンサー
- JavaScript
- google map api v3の表示の不具合について教えてください
google map api v3の表示の不具合について教えてください。 google map api v3を実装してマーカーをつけたのですが、あれこれ直していたら表示されない箇所ができてしまいました。（下記画像参照） ソースは下記です。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>××</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link href="css/page.css" rel="stylesheet" type="text/css" /> <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script> google.maps.event.addDomListener(window, 'load', function() { var mapdiv = document.getElementById("map"); var myOptions = { zoom: ズーム, center: new google.maps.LatLng(緯度, 経度), mapTypeId: google.maps.MapTypeId.ROADMAP, scaleControl: true }; var map = new google.maps.Map(mapdiv, myOptions); var marker = new google.maps.Marker({ position: new google.maps.LatLng(緯度, 経度), map: map, title: '名称' }); }); </script> </head> <div id="map"></div> お手数かけて申し訳ありませんが、ホームページ初心者なのでご指導いただければ助かります。 なにとぞよろしくお願い致します。
- ベストアンサー
- JavaScript
- グーグルマップのタグ記述について
グーグルマップを設置する時に以下（一部を掲載）の中に「<title>タイトル</title>」となっている箇所があります。この「タイトル」に適当な言葉をいれた場合、どのような意味がありますか。あるいはウエッブで見たときにどこかにその言葉が表示されるのでしょうか。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>タイトル</title> <script src="http://maps.google.com/maps?file=api&v=2&key=ここにあなたのGoogleMapsAPIキーを入力" type="text/javascript"></script>
- 締切済み
- AJAX
- GoogleMapを複数表示させたい
GoogleMap を API で２つ表示させて、それぞれの地図にマーカーをひとつずつつけたいです。 マーカーをつけて吹き出すをだすまではできたのですが、 マップをもうひとつ増やすにはどのように記述すればよいでしょうか？ 現在のソースは以下です -------------------------------------------------------- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <style type="text/css"> #Gmap{ width:500px; height:500px; } </style> <script src="http://maps.google.com/maps?file=api&v=2&key=http://maps.google.com/maps?file=api&v=2&key=" type="text/javascript" charset="utf-8"></script> <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { //地図を作成 var map = new GMap2(document.getElementById("Gmap")); map.setCenter(new GLatLng(35.675845,139.744763), 15); //マーカーを作成 var marker = new GMarker(new GLatLng(35.675845,139.744763)); //マーカーをクリックしたら、吹き出しの中に写真を表示する GEvent.addListener(marker, "click", function() { marker.openInfoWindowHtml("テキストが入ります"); }); //マーカーを地図上に配置 map.addOverlay(marker); //縮尺移動のコントロールを設置 map.addControl(new GLargeMapControl()); //地図衛星写真 切り替えボタンを表示 map.addControl(new GMapTypeControl()); //縮尺表示 map.addControl(new GScaleControl()); } } //]]> </script> </head> <body onload="load()" onunload="GUnload()"> <div id="Gmap"></div> </body> </html> -------------------------------------------------------- よろしくお願いいたします
- ベストアンサー
- その他（プログラミング・開発）
- サイトマップを自動作成できません。
最近ＨＰを作成した超初心者で、サイトマップの作成ができず 原因が皆目見当つかず行き詰ってしまいました。 サイトマップを自動生成してくれる「sitemap.xml Editor」を利用しているのですが index.html以外のページをサイトマップ化できません。 sitemap.xml Editor https://www.sitemapxml.jp/ ネット上で確認すると、index.htmlのリンクから他のページを表示することができます。 現在、ページ数はindex.htmlを含め20程です。 先頭のタグは全て共通で下の通りです。 基礎的な質問で恐縮ですが、解決のヒントなど教えていただけないｄしょうか？ よろしくお願いします。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> <meta http-equiv="imagetoolbar" content="no" /> <meta name="description" content="説明文" /> <meta name="keywords" content="キーワード" /> <link rel="stylesheet" href="css/common.css" type="text/css" /> <script type="text/javascript" src="js/jquery.js"></script> <script type="text/javascript" src="js/common.js"></script> <title>タイトル</title> <script type="text/javascript"> var _gaq = _gaq || []; _gaq.push(['_setAccount', 'UA-28512541-1']); _gaq.push(['_trackPageview']); (function() { var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true; ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js'; var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s); })(); </script> </head>
- ベストアンサー
- SEO
- cssがIE6で適用されない理由は
教則本を見てcss/xhtmlでサイトを作ったのですが、 （教則本がIE7以降対応だった為） safari firefoxd IE7では表示がうまくいくのですが、 IE6では全くcssが適用されないです。 少し調べたところこの辺の記述に問題があるのかなと思っています。 誰か教えて下さい。 ............................................................................... <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="jap" lang="jap" dir="ltr"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta http-equiv="Content-Script-Type" content="text/css" /> <meta http-equiv="Content-Script-Type" content="text/javascript" /> ....................................................................
- ベストアンサー
- HTML
- googleMapのマーカーがうまく表示されません
googleMapを使って地図を表示させていますが、MarkerやopenInfoWindowといった関数の部分が上手く表示されません。具体的なスクリプトはこんな感じです。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Google Maps JavaScript API Example</title> <script src="http://maps.google.com/maps?file=api&v=2&key=ABQIAAAAREfirLNOQkMPltS0MtM_aRT2vOvOMLA6ksVZJNRPEoKnAz-wSxSLgFyYzSPMTRAqy1S4fTvUnXKX-g" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); map.setCenter(new GLatLng(35.689488, 139.691706), 20); map.addControl(new GLargeMapControl()); map.centerAndZoom(new GPoint(35.689488, 139.691706), 20); //マーカー var marker=new GMarker(new GPoint(35.689488, 139.691706)); map.addOverlay(marker); //吹き出し var msg="ここです"; map.openInfoWindowHtml(map.getCenterLatLng(),msg); } } //]]> </script> </head> <body onload="load()" onunload="GUnload()"> <div id="map" style="width: 500px; height: 500px"></div> <script type="text/javascript"> </body> </html> どなたかご教授くださると助かります。 宜しくお願いいたします。
- ベストアンサー
- JavaScript
- 地図上クリックで情報ウィンドウを閉じるには…
Google maps API V3 で 開いた情報ウィンドウが地図上をクリックすると閉じるように設定しようと、 google.maps.event.addListener(map,'click',function(){ infowindow.close(); }); を追記したのですが、上手く動いてくれません。 どこが悪いのか、お分かりになる方、よろしくお願い致します。 <!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"/> <meta name="viewport" content="initial-scale=1.0, user-scalable=yes" /> <meta http-equiv="Content-Style-Type" content="text/css" /> <title>TEST</title> <style type="text/css"> html {height: 100%;} body {text-align: CENTER; height: 100%; margin: 0; padding: 0; background-color:#ffffff; font-size: small;} </style> <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=true&language=ja"></script> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript"> var map; function initialize() { var myLatlng = new google.maps.LatLng(35.681373, 139.766084); var myOptions = { zoom: 14, center: myLatlng, mapTypeId: google.maps.MapTypeId.ROADMAP } map = new google.maps.Map(document.getElementById("map_canvas"), myOptions); var layer = new google.maps.FusionTablesLayer({ query: {select: 'Geocodable address', from: 'FusionTablesのIDが入ります'}});layer.setMap(map); } google.maps.event.addListener(map,'click',function(){ infowindow.close(); }); </script> </head> <body> <body onload="initialize()"> <div id="map_canvas" style="width:100%; height:100%"></div> </body> </html>
- 締切済み
- JavaScript
- SafariでPHPソースがそのまま表示される
Safariでindex.phpを開くとソースコードがそのまま表示されてしまいます。 拡張子をphpとしているだけでソース内にはphpスクリプトは記述しておりません。 なぜでしょうか？ ※ファイル名をindex.htmlに変えると正しく表示されます。 Windows 7 Home Premium 64bit Safari5.1.5 ソースコードのエンコーディング：utf-8 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="content-style-type" content="text/css" /> <meta http-equiv="content-script-type" content="text/javascript" /> <meta name="keywords" content="" /> <meta name="description" content="" /> <title>テストtitle> </head> <body> <h1>テストページ</h1> </body> </html>
- ベストアンサー
- ブラウザ
- google mapをiframeで表示させた後、GoogleMapA
google mapをiframeで表示させた後、GoogleMapAPIを使用して地図を カスタマイズする方法を教えてください。 Google Map APIおよび、htmlのコーディングに関しても全くの初心者です。 マップ上にマーカーを表示させたくて下記のように見よう見まねでプログラミングしましたが 地図は表示されますが、マーカーが表示されませんでした。 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dt … <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>Google Maps JavaScript API Example</title> <script src="http://maps.google.com/maps?file=api&v=2& …キー]" type="text/javascript"></script> <script type="text/javascript"> //<![CDATA[ function load() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")); var marker = new GMarker(new GLatLng(34.685567, 135.527467)); map.addOverlay(marker); } } //]]> </script> </head> <iframe width="600" height="600" frameborder="1" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.co.jp/maps/ms?ie=UTF8&hl= … msid=..................;z=5&output=embed"> </iframe> </html> 関数を記述する場所がまちがっているのか、ほかに記述するべき関数がいるのか、 大変初歩的で申し訳ないのですが、ご回答のほどよろしくお願いします。
- ベストアンサー
- HTML
