回答編集履歴
3
コメントを受けて追記
test
CHANGED
|
@@ -49,3 +49,75 @@
|
|
|
49
49
|
|
|
50
50
|
|
|
51
51
|
開発者ツールを見て、エラーメッセージを読み、`console.log`などを使って、変数に入っている値とその構造を確認しながらコーディングを進めるべきです。
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
### コメントを受けて追記
|
|
56
|
+
|
|
57
|
+
|
|
58
|
+
|
|
59
|
+
```js
|
|
60
|
+
|
|
61
|
+
function DataXML(){
|
|
62
|
+
|
|
63
|
+
|
|
64
|
+
|
|
65
|
+
var text, parser, xmlDoc;
|
|
66
|
+
|
|
67
|
+
text ='...';
|
|
68
|
+
|
|
69
|
+
|
|
70
|
+
|
|
71
|
+
var parser = new DOMParser();
|
|
72
|
+
|
|
73
|
+
var xmlDoc = parser.parseFromString(text,"application/xml");
|
|
74
|
+
|
|
75
|
+
return xmlDoc.getElementsByTagName('googleMaps');
|
|
76
|
+
|
|
77
|
+
}
|
|
78
|
+
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
var googleMaps = DataXML();
|
|
82
|
+
|
|
83
|
+
var lat = Number( googleMaps[0].attributes.lat.value );
|
|
84
|
+
|
|
85
|
+
var lon = Number( googleMaps[0].attributes.lon.value );
|
|
86
|
+
|
|
87
|
+
|
|
88
|
+
|
|
89
|
+
function initMap() {
|
|
90
|
+
|
|
91
|
+
|
|
92
|
+
|
|
93
|
+
var map = new google.maps.Map(document.getElementById('demo'),{
|
|
94
|
+
|
|
95
|
+
zoom: 12,
|
|
96
|
+
|
|
97
|
+
center: new google.maps.LatLng(41.409651, 2.183685),
|
|
98
|
+
|
|
99
|
+
mapTypeId: google.maps.MapTypeId.ROADMAP
|
|
100
|
+
|
|
101
|
+
});
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
|
|
105
|
+
var latLng = new google.maps.LatLng(lat,lon);
|
|
106
|
+
|
|
107
|
+
|
|
108
|
+
|
|
109
|
+
var marker = new google.maps.Marker({
|
|
110
|
+
|
|
111
|
+
position: latLng,
|
|
112
|
+
|
|
113
|
+
map: map,
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
|
|
117
|
+
});
|
|
118
|
+
|
|
119
|
+
}
|
|
120
|
+
|
|
121
|
+
```
|
|
122
|
+
|
|
123
|
+
こちらだとどうなりますか？
|
2
質問の編集にあわせて追記2
test
CHANGED
|
@@ -33,3 +33,19 @@
|
|
|
33
33
|
1. [new google.maps.LatLng()](https://developers.google.com/maps/documentation/javascript/reference/coordinates#LatLng)ですが、引数は数値です。
|
|
34
34
|
|
|
35
35
|
そのため、[Number](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Number)などを利用する必要があります。
|
|
36
|
+
|
|
37
|
+
|
|
38
|
+
|
|
39
|
+
### 質問の編集にあわせて追記2
|
|
40
|
+
|
|
41
|
+
1. `var b = googleMap.attributes.lat;`ですが、`var`で宣言された変数は、その関数の中にスコープを持ち外からは参照できません。この場合、`DataXML()`の外側からは参照できないということです。
|
|
42
|
+
|
|
43
|
+
1. `return xmlDoc;`ですが、`xmlDoc`は変更を加えられていませんので、返ってくるのはXML全体のXMLDocumentです。これは想定と異なるのでは。
|
|
44
|
+
|
|
45
|
+
1. `new Number(ddd);`ですが、上のコメントのとおりです。`Number(文字列)`とすることで、数値化できます。この場合、`ddd`に入っているのは`xmlDoc`ですから、文字列ではありません。
|
|
46
|
+
|
|
47
|
+
1. `eee.b`ですが、3のとおり`eee`には期待しているものが入っていません。また、1のとおり、プロパティのように参照できるものでもありません。
|
|
48
|
+
|
|
49
|
+
|
|
50
|
+
|
|
51
|
+
開発者ツールを見て、エラーメッセージを読み、`console.log`などを使って、変数に入っている値とその構造を確認しながらコーディングを進めるべきです。
|
1
質問の編集にあわせて追記
test
CHANGED
|
@@ -9,3 +9,27 @@
|
|
|
9
9
|
1. `googleMaps`に入っているのは、おそらく[XMLDocument](>XMLDocument - Web APIs | MDN [XMLDocument - Web APIs | MDN](https://developer.mozilla.org/en-US/docs/Web/API/XMLDocument))です。なので、`.lat`というプロパティはありません。
|
|
10
10
|
|
|
11
11
|
解決方法ですが、DOM API を使って参照してください。
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
### 質問の編集にあわせて追記
|
|
16
|
+
|
|
17
|
+
1. `parseFromString(text,"data/xml")`ですが、`data/xml`というMIMETYPEは不適切だと思います。
|
|
18
|
+
|
|
19
|
+
`application/xml`にしてみてください。
|
|
20
|
+
|
|
21
|
+
1. `getElementsByTagName('lat')`ですが、`lat`というタグはないようです。
|
|
22
|
+
|
|
23
|
+
おそらく、`getElementsByTagName('googleMaps')`の間違いかと思います。
|
|
24
|
+
|
|
25
|
+
1. `getElementsByTagName()`は[HTMLCollection](https://developer.mozilla.org/ja/docs/Web/API/HTMLCollection)を返します。
|
|
26
|
+
|
|
27
|
+
そのため、`hoge[0]`などのように添え字をつけるなどしてアクセスする必要があります。
|
|
28
|
+
|
|
29
|
+
1. そして`hoge[0]`は[Element](https://developer.mozilla.org/ja/docs/Web/API/Element)です。この場合、`<googleMaps lat="41.359684477777776" lon="2.145138777777778"/>`などが入っています。
|
|
30
|
+
|
|
31
|
+
この要素の属性を得るには`attributes`プロパティにアクセスする必要があります。`.attributes.lat`などとしてみてください。
|
|
32
|
+
|
|
33
|
+
1. [new google.maps.LatLng()](https://developers.google.com/maps/documentation/javascript/reference/coordinates#LatLng)ですが、引数は数値です。
|
|
34
|
+
|
|
35
|
+
そのため、[Number](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Number)などを利用する必要があります。
|