質問編集履歴
1
わかりやすく
test
CHANGED
|
File without changes
|
test
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
現在、一番下に記載したコードを用い、GoogleMapsにおいて以下のようなXMLファイルのデータを取り出してピンを表示させています。
|
|
4
4
|
|
|
5
|
-
また、PHPで受け取った緯度・経度の変数から表示する場所を動的に変更させています。
|
|
5
|
+
また、PHPで受け取った緯度・経度の変数(lat,lng)から表示する場所を動的に変更させています。
|
|
6
6
|
|
|
7
7
|
|
|
8
8
|
|
|
@@ -24,7 +24,7 @@
|
|
|
24
24
|
|
|
25
25
|
|
|
26
26
|
|
|
27
|
-
そこで今回、PHPから受け取った変数typeのみのピンだけを表示させれる
|
|
27
|
+
そこで今回、PHPから受け取った変数typeのみのピンだけを表示させれる(「変数type=XMLファイルのtype」のmarker)ようにコードを修正したいのですが、上手く出来ません。
|
|
28
28
|
|
|
29
29
|
このような場合どうすればよいでしょうか?
|
|
30
30
|
|
|
@@ -54,7 +54,7 @@
|
|
|
54
54
|
|
|
55
55
|
$lng=htmlspecialchars($lng);
|
|
56
56
|
|
|
57
|
-
$type=htmlspecialchars($type);
|
|
57
|
+
//$type=htmlspecialchars($type);
|
|
58
58
|
|
|
59
59
|
|
|
60
60
|
|
|
@@ -114,114 +114,114 @@
|
|
|
114
114
|
|
|
115
115
|
|
|
116
116
|
|
|
117
|
-
|
|
117
|
+
function load() {
|
|
118
|
-
|
|
118
|
+
|
|
119
|
-
|
|
119
|
+
var map = new google.maps.Map(document.getElementById("map"), {
|
|
120
|
-
|
|
120
|
+
|
|
121
|
-
|
|
121
|
+
center: new google.maps.LatLng(lat, lng),
|
|
122
|
-
|
|
122
|
+
|
|
123
|
-
|
|
123
|
+
zoom: 13,
|
|
124
|
-
|
|
124
|
+
|
|
125
|
-
|
|
125
|
+
mapTypeId: 'roadmap'
|
|
126
|
+
|
|
127
|
+
});
|
|
128
|
+
|
|
129
|
+
var infoWindow = new google.maps.InfoWindow;
|
|
130
|
+
|
|
131
|
+
|
|
132
|
+
|
|
133
|
+
|
|
134
|
+
|
|
135
|
+
downloadUrl("http://略(XMLファイル)", function(data) {
|
|
136
|
+
|
|
137
|
+
var xml = data.responseXML;
|
|
138
|
+
|
|
139
|
+
var markers = xml.documentElement.getElementsByTagName("marker");
|
|
140
|
+
|
|
141
|
+
for (var i = 0; i < markers.length; i++) {
|
|
142
|
+
|
|
143
|
+
var name = markers[i].getAttribute("name");
|
|
144
|
+
|
|
145
|
+
var address = markers[i].getAttribute("address");
|
|
146
|
+
|
|
147
|
+
var type = markers[i].getAttribute("type");
|
|
148
|
+
|
|
149
|
+
var point = new google.maps.LatLng(
|
|
150
|
+
|
|
151
|
+
parseFloat(markers[i].getAttribute("lat")),
|
|
152
|
+
|
|
153
|
+
parseFloat(markers[i].getAttribute("lng")));
|
|
154
|
+
|
|
155
|
+
var html = "<b>" + name + "</b> <br/>" + address;
|
|
156
|
+
|
|
157
|
+
var icon = customIcons[type] || {};
|
|
158
|
+
|
|
159
|
+
var marker = new google.maps.Marker({
|
|
160
|
+
|
|
161
|
+
map: map,
|
|
162
|
+
|
|
163
|
+
position: point,
|
|
164
|
+
|
|
165
|
+
icon: icon.icon
|
|
166
|
+
|
|
167
|
+
});
|
|
168
|
+
|
|
169
|
+
bindInfoWindow(marker, map, infoWindow, html);
|
|
170
|
+
|
|
171
|
+
}
|
|
172
|
+
|
|
173
|
+
});
|
|
174
|
+
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
|
|
178
|
+
|
|
179
|
+
function bindInfoWindow(marker, map, infoWindow, html) {
|
|
180
|
+
|
|
181
|
+
google.maps.event.addListener(marker, 'click', function() {
|
|
182
|
+
|
|
183
|
+
infoWindow.setContent(html);
|
|
184
|
+
|
|
185
|
+
infoWindow.open(map, marker);
|
|
126
186
|
|
|
127
187
|
});
|
|
128
188
|
|
|
129
|
-
var infoWindow = new google.maps.InfoWindow;
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
// Change this depending on the name of your PHP file
|
|
134
|
-
|
|
135
|
-
downloadUrl("http://略(XMLファイル)", function(data) {
|
|
136
|
-
|
|
137
|
-
var xml = data.responseXML;
|
|
138
|
-
|
|
139
|
-
var markers = xml.documentElement.getElementsByTagName("marker");
|
|
140
|
-
|
|
141
|
-
for (var i = 0; i < markers.length; i++) {
|
|
142
|
-
|
|
143
|
-
var name = markers[i].getAttribute("name");
|
|
144
|
-
|
|
145
|
-
var address = markers[i].getAttribute("address");
|
|
146
|
-
|
|
147
|
-
var type = markers[i].getAttribute("type");
|
|
148
|
-
|
|
149
|
-
var point = new google.maps.LatLng(
|
|
150
|
-
|
|
151
|
-
parseFloat(markers[i].getAttribute("lat")),
|
|
152
|
-
|
|
153
|
-
parseFloat(markers[i].getAttribute("lng")));
|
|
154
|
-
|
|
155
|
-
var html = "<b>" + name + "</b> <br/>" + address;
|
|
156
|
-
|
|
157
|
-
var icon = customIcons[type] || {};
|
|
158
|
-
|
|
159
|
-
var marker = new google.maps.Marker({
|
|
160
|
-
|
|
161
|
-
map: map,
|
|
162
|
-
|
|
163
|
-
position: point,
|
|
164
|
-
|
|
165
|
-
icon: icon.icon
|
|
166
|
-
|
|
167
|
-
});
|
|
168
|
-
|
|
169
|
-
bindInfoWindow(marker, map, infoWindow, html);
|
|
170
|
-
|
|
171
|
-
}
|
|
172
|
-
|
|
173
|
-
});
|
|
174
|
-
|
|
175
189
|
}
|
|
176
190
|
|
|
177
191
|
|
|
178
192
|
|
|
179
|
-
function
|
|
193
|
+
function downloadUrl(url, callback) {
|
|
194
|
+
|
|
180
|
-
|
|
195
|
+
var request = window.ActiveXObject ?
|
|
196
|
+
|
|
197
|
+
new ActiveXObject('Microsoft.XMLHTTP') :
|
|
198
|
+
|
|
199
|
+
new XMLHttpRequest;
|
|
200
|
+
|
|
201
|
+
|
|
202
|
+
|
|
181
|
-
|
|
203
|
+
request.onreadystatechange = function() {
|
|
182
|
-
|
|
204
|
+
|
|
183
|
-
|
|
205
|
+
if (request.readyState == 4) {
|
|
206
|
+
|
|
184
|
-
|
|
207
|
+
request.onreadystatechange = doNothing;
|
|
208
|
+
|
|
185
|
-
|
|
209
|
+
callback(request, request.status);
|
|
210
|
+
|
|
186
|
-
|
|
211
|
+
}
|
|
212
|
+
|
|
187
|
-
|
|
213
|
+
};
|
|
214
|
+
|
|
215
|
+
|
|
216
|
+
|
|
217
|
+
request.open('GET', url, true);
|
|
218
|
+
|
|
219
|
+
request.send(null);
|
|
188
220
|
|
|
189
221
|
}
|
|
190
222
|
|
|
191
223
|
|
|
192
224
|
|
|
193
|
-
function downloadUrl(url, callback) {
|
|
194
|
-
|
|
195
|
-
var request = window.ActiveXObject ?
|
|
196
|
-
|
|
197
|
-
new ActiveXObject('Microsoft.XMLHTTP') :
|
|
198
|
-
|
|
199
|
-
new XMLHttpRequest;
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
request.onreadystatechange = function() {
|
|
204
|
-
|
|
205
|
-
if (request.readyState == 4) {
|
|
206
|
-
|
|
207
|
-
request.onreadystatechange = doNothing;
|
|
208
|
-
|
|
209
|
-
callback(request, request.status);
|
|
210
|
-
|
|
211
|
-
}
|
|
212
|
-
|
|
213
|
-
};
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
request.open('GET', url, true);
|
|
218
|
-
|
|
219
|
-
request.send(null);
|
|
220
|
-
|
|
221
|
-
}
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
225
|
function doNothing() {}
|
|
226
226
|
|
|
227
227
|
|