質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

Q&A

1回答

4421閲覧

Google Mapsのピンが表示されない!!

Shinog

総合スコア99

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Google マップ

Google Mapは、Google社がオンラインで提供している地図・ローカル検索サービスです。GIS(Geographic Information System:地理情報システム)の中の「WebGIS」に該当します。地図・航空写真・地形の表示方式があり、それぞれユーザーが縮尺を調整して表示させることができます。地域の情報サービスを検索する機能やルート検索の機能も搭載されています。

HTML

HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

0グッド

0クリップ

投稿2015/05/19 13:41

はじめまして!

現在、以下のGoogle Maps公式サイトを参考にしながら、XMLファイルを読み込みマップに表示させようとしている者です。
https://developers.google.com/maps/articles/phpsqlajax_v3?hl=ja#createtable

上記のURLの最後に、XMLファイルをよみこみピンを表示させるサンプルコードが記載されていたのですが、ピンが表示しませんでした。

var customIconsのレストラン、バーの部分を自分のXMLファイルのタイプに書き換えることはもちろんのこと、

lang

1<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script>

の部分を

lang

1 <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=略"></script>

に変更しても変化はありませんでした。

このコードをご覧になって、何かおかしい部分等ございましたら是非ご教授ください!!

よろしくお願い申し上げます。

lang

1<!DOCTYPE html > 2 <head> 3 <meta name="viewport" content="initial-scale=1.0, user-scalable=no" /> 4 <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> 5 <title>PHP/MySQL & Google Maps Example</title> 6 <script type="text/javascript" src="https://maps.googleapis.com/maps/api/js"></script> 7 <script type="text/javascript"> 8 //<![CDATA[ 9 10 var customIcons = { 11 restaurant: { 12 icon: 'http://labs.google.com/ridefinder/images/mm_20_blue.png' 13 }, 14 bar: { 15 icon: 'http://labs.google.com/ridefinder/images/mm_20_red.png' 16 } 17 }; 18 19 function load() { 20 var map = new google.maps.Map(document.getElementById("map"), { 21 center: new google.maps.LatLng(47.6145, -122.3418), 22 zoom: 13, 23 mapTypeId: 'roadmap' 24 }); 25 var infoWindow = new google.maps.InfoWindow; 26 27 // Change this depending on the name of your PHP file 28 downloadUrl("phpsqlajax_genxml.php", function(data) { 29 var xml = data.responseXML; 30 var markers = xml.documentElement.getElementsByTagName("marker"); 31 for (var i = 0; i < markers.length; i++) { 32 var name = markers[i].getAttribute("name"); 33 var address = markers[i].getAttribute("address"); 34 var type = markers[i].getAttribute("type"); 35 var point = new google.maps.LatLng( 36 parseFloat(markers[i].getAttribute("lat")), 37 parseFloat(markers[i].getAttribute("lng"))); 38 var html = "<b>" + name + "</b> <br/>" + address; 39 var icon = customIcons[type] || {}; 40 var marker = new google.maps.Marker({ 41 map: map, 42 position: point, 43 icon: icon.icon 44 }); 45 bindInfoWindow(marker, map, infoWindow, html); 46 } 47 }); 48 } 49 50 function bindInfoWindow(marker, map, infoWindow, html) { 51 google.maps.event.addListener(marker, 'click', function() { 52 infoWindow.setContent(html); 53 infoWindow.open(map, marker); 54 }); 55 } 56 57 function downloadUrl(url, callback) { 58 var request = window.ActiveXObject ? 59 new ActiveXObject('Microsoft.XMLHTTP') : 60 new XMLHttpRequest; 61 62 request.onreadystatechange = function() { 63 if (request.readyState == 4) { 64 request.onreadystatechange = doNothing; 65 callback(request, request.status); 66 } 67 }; 68 69 request.open('GET', url, true); 70 request.send(null); 71 } 72 73 function doNothing() {} 74 75 //]]> 76 77 </script> 78 79 </head> 80 81 <body onload="load()"> 82 <div id="map" style="width: 500px; height: 300px"></div> 83 </body> 84 85</html> 86

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答1

0

phpsqlajax_genxml.php を、ご自分のサーバのXMLに書き換えれば良いかと。

downloadUrl("http://www.hogehoge.com/hoge/hoge.xml", function(data) {

Attributeの名前は同じに、値はそれなりにしないと、です。

投稿2015/05/19 14:11

編集2015/05/19 14:15
SaintKnowledge

総合スコア368

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだベストアンサーが選ばれていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問