지창언

markers.push no action err

...@@ -15,6 +15,7 @@ ...@@ -15,6 +15,7 @@
15 <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=c71c02e15245260c3350614980ba87c8&libraries=services,clusterer,drawing"></script> 15 <script type="text/javascript" src="//dapi.kakao.com/v2/maps/sdk.js?appkey=c71c02e15245260c3350614980ba87c8&libraries=services,clusterer,drawing"></script>
16 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 16 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
17 <script> 17 <script>
18 +
18 // 고속도로 선택 함수 19 // 고속도로 선택 함수
19 function showline(lineNumber){ 20 function showline(lineNumber){
20 // 이 위치에 이전에 켜져있는 map을 지우는 기능 넣어야해 ... 21 // 이 위치에 이전에 켜져있는 map을 지우는 기능 넣어야해 ...
...@@ -54,50 +55,54 @@ ...@@ -54,50 +55,54 @@
54 55
55 56
56 57
58 + var userData;
59 +
57 // 1번 페이지 60 // 1번 페이지
58 $.ajax({ 61 $.ajax({
62 +
59 url: "http://data.ex.co.kr/openapi/business/conveniServiceArea?key=1817997939&type=json&numOfRows=99&pageNo=1", 63 url: "http://data.ex.co.kr/openapi/business/conveniServiceArea?key=1817997939&type=json&numOfRows=99&pageNo=1",
64 + async:false,
60 success: function(data){ 65 success: function(data){
61 - var userData = JSON.stringify(data); 66 + //변수 설정
62 - var result_str=""; 67 + userData = data;
63 - var routeCode = ""; 68 + },
64 - var svarAddr = ""; 69 + })
65 - var count = data["list"].length; 70 + var markers = [];
71 + var infomations =[];
72 + var result_str="";
73 + var routeCode = "";
74 + var svarAddr = "";
75 + var rest_name = "";
76 + var data_count = userData["list"].length // 데이터 개수 얻기
77 +
78 + for (var i =0; i<data_count; i++){
79 + routeCode = JSON.stringify(userData["list"][i]["routeCode"]);
80 + svarAddr = JSON.stringify(userData["list"][i]["svarAddr"]);
81 + rest_name = JSON.stringify(userData["list"][i]["serviceAreaName"]);
82 +
83 + if(routeCode.substring(1,5) === lineNumber){ // 고속도로 코드가 같다면
66 84
67 - for (var i =0; i<count; i++){ 85 + var geocoder = new kakao.maps.services.Geocoder();
68 - routeCode = JSON.stringify(data["list"][i]["routeCode"]); 86 + // 주소로 좌표를 검색합니다
69 - svarAddr = JSON.stringify(data["list"][i]["svarAddr"]); 87 + geocoder.addressSearch(svarAddr, function(result, status) {
70 - if(routeCode.substring(1,5) === lineNumber){ 88 + // 정상적으로 검색이 완료됐으면
71 - document.getElementById("testArea").innerHTML += routeCode.substring(1,5)+ " "; 89 + if (status === kakao.maps.services.Status.OK) {
72 - var geocoder = new kakao.maps.services.Geocoder(); 90 + //위치 저장
73 - 91 + var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
74 - // 주소로 좌표를 검색합니다 92 +
75 - geocoder.addressSearch(svarAddr, function(result, status) { 93 + var marker = new kakao.maps.Marker({
76 - 94 + position: coords,
77 - // 정상적으로 검색이 완료됐으면 95 + map: map
78 - if (status === kakao.maps.services.Status.OK) {
79 -
80 - var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
81 -
82 - // 결과값으로 받은 위치를 마커로 표시합니다
83 - var marker = new kakao.maps.Marker({
84 - map: map,
85 - position: coords
86 - });
87 -
88 - // 인포윈도우로 장소에 대한 설명을 표시합니다
89 - var infowindow = new kakao.maps.InfoWindow({
90 - content: '<div style="width:150px;text-align:center;padding:6px 0;" id ="position_ex"></div>'
91 - });
92 - document.getElementById("position_ex").innerHTML = svarAddr;
93 - infowindow.open(map, marker);
94 - }
95 }); 96 });
97 + markers.push(marker); // markers 로 정상적 push 수행 안됨
96 } 98 }
97 - 99 + });
98 - } 100 +
99 - }, 101 + }
100 - }) 102 + }
103 +
104 + alert(markers.length)
105 + /*
101 // 2번 페이지 106 // 2번 페이지
102 $.ajax({ 107 $.ajax({
103 url: "http://data.ex.co.kr/openapi/business/conveniServiceArea?key=1817997939&type=json&numOfRows=99&pageNo=2", 108 url: "http://data.ex.co.kr/openapi/business/conveniServiceArea?key=1817997939&type=json&numOfRows=99&pageNo=2",
...@@ -106,15 +111,20 @@ ...@@ -106,15 +111,20 @@
106 var result_str=""; 111 var result_str="";
107 var routeCode = ""; 112 var routeCode = "";
108 var svarAddr = ""; 113 var svarAddr = "";
114 + var rest_name = "";
109 var count = data["list"].length; 115 var count = data["list"].length;
110 116
111 for (var i =0; i<count; i++){ 117 for (var i =0; i<count; i++){
112 routeCode = JSON.stringify(data["list"][i]["routeCode"]); 118 routeCode = JSON.stringify(data["list"][i]["routeCode"]);
113 svarAddr = JSON.stringify(data["list"][i]["svarAddr"]); 119 svarAddr = JSON.stringify(data["list"][i]["svarAddr"]);
120 + rest_name = JSON.stringify(data["list"][i]["serviceAreaName"]);
121 + var infowindow = new kakao.maps.InfoWindow({
122 + content: rest_name
123 + });
114 if(routeCode.substring(1,5) === lineNumber){ 124 if(routeCode.substring(1,5) === lineNumber){
115 document.getElementById("testArea").innerHTML += routeCode.substring(1,5)+ " "; 125 document.getElementById("testArea").innerHTML += routeCode.substring(1,5)+ " ";
116 var geocoder = new kakao.maps.services.Geocoder(); 126 var geocoder = new kakao.maps.services.Geocoder();
117 - 127 +
118 // 주소로 좌표를 검색합니다 128 // 주소로 좌표를 검색합니다
119 geocoder.addressSearch(svarAddr, function(result, status) { 129 geocoder.addressSearch(svarAddr, function(result, status) {
120 130
...@@ -122,19 +132,19 @@ ...@@ -122,19 +132,19 @@
122 if (status === kakao.maps.services.Status.OK) { 132 if (status === kakao.maps.services.Status.OK) {
123 133
124 var coords = new kakao.maps.LatLng(result[0].y, result[0].x); 134 var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
125 - 135 + var temp = i
136 +
126 // 결과값으로 받은 위치를 마커로 표시합니다 137 // 결과값으로 받은 위치를 마커로 표시합니다
127 var marker = new kakao.maps.Marker({ 138 var marker = new kakao.maps.Marker({
128 map: map, 139 map: map,
129 - position: coords 140 + position: coords,
130 }); 141 });
131 142
132 // 인포윈도우로 장소에 대한 설명을 표시합니다 143 // 인포윈도우로 장소에 대한 설명을 표시합니다
133 - var infowindow = new kakao.maps.InfoWindow({ 144 + kakao.maps.event.addListener(marker, 'mouseover', makeOverListener(map, marker, infowindow));
134 - content: '<div style="width:150px;text-align:center;padding:6px 0;" id ="position"></div>' 145 + kakao.maps.event.addListener(marker, 'mouseout', makeOutListener(infowindow));
135 - }); 146 + document.getElementById("position_ex").innerHTML = svarAddr;
136 - document.getElementById("position").innerHTML = svarAddr; 147 +
137 - infowindow.open(map, marker);
138 } 148 }
139 }); 149 });
140 } 150 }
...@@ -150,15 +160,20 @@ ...@@ -150,15 +160,20 @@
150 var result_str=""; 160 var result_str="";
151 var routeCode = ""; 161 var routeCode = "";
152 var svarAddr = ""; 162 var svarAddr = "";
163 + var rest_name = "";
153 var count = data["list"].length; 164 var count = data["list"].length;
154 165
155 for (var i =0; i<count; i++){ 166 for (var i =0; i<count; i++){
156 routeCode = JSON.stringify(data["list"][i]["routeCode"]); 167 routeCode = JSON.stringify(data["list"][i]["routeCode"]);
157 svarAddr = JSON.stringify(data["list"][i]["svarAddr"]); 168 svarAddr = JSON.stringify(data["list"][i]["svarAddr"]);
169 + rest_name = JSON.stringify(data["list"][i]["serviceAreaName"]);
170 + var infowindow = new kakao.maps.InfoWindow({
171 + content: rest_name
172 + });
158 if(routeCode.substring(1,5) === lineNumber){ 173 if(routeCode.substring(1,5) === lineNumber){
159 document.getElementById("testArea").innerHTML += routeCode.substring(1,5)+ " "; 174 document.getElementById("testArea").innerHTML += routeCode.substring(1,5)+ " ";
160 var geocoder = new kakao.maps.services.Geocoder(); 175 var geocoder = new kakao.maps.services.Geocoder();
161 - 176 +
162 // 주소로 좌표를 검색합니다 177 // 주소로 좌표를 검색합니다
163 geocoder.addressSearch(svarAddr, function(result, status) { 178 geocoder.addressSearch(svarAddr, function(result, status) {
164 179
...@@ -166,19 +181,19 @@ ...@@ -166,19 +181,19 @@
166 if (status === kakao.maps.services.Status.OK) { 181 if (status === kakao.maps.services.Status.OK) {
167 182
168 var coords = new kakao.maps.LatLng(result[0].y, result[0].x); 183 var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
169 - 184 + var temp = i
185 +
170 // 결과값으로 받은 위치를 마커로 표시합니다 186 // 결과값으로 받은 위치를 마커로 표시합니다
171 var marker = new kakao.maps.Marker({ 187 var marker = new kakao.maps.Marker({
172 map: map, 188 map: map,
173 - position: coords 189 + position: coords,
174 }); 190 });
175 191
176 // 인포윈도우로 장소에 대한 설명을 표시합니다 192 // 인포윈도우로 장소에 대한 설명을 표시합니다
177 - var infowindow = new kakao.maps.InfoWindow({ 193 + kakao.maps.event.addListener(marker, 'mouseover', makeOverListener(map, marker, infowindow));
178 - content: '<div style="width:150px;text-align:center;padding:6px 0;" id ="position"></div>' 194 + kakao.maps.event.addListener(marker, 'mouseout', makeOutListener(infowindow));
179 - }); 195 + document.getElementById("position_ex").innerHTML = svarAddr;
180 - document.getElementById("position").innerHTML = svarAddr; 196 +
181 - infowindow.open(map, marker);
182 } 197 }
183 }); 198 });
184 } 199 }
...@@ -186,7 +201,7 @@ ...@@ -186,7 +201,7 @@
186 } 201 }
187 }, 202 },
188 }) 203 })
189 - 204 + */
190 } 205 }
191 </script> 206 </script>
192 </head> 207 </head>
...@@ -242,7 +257,11 @@ ...@@ -242,7 +257,11 @@
242 </div> 257 </div>
243 </div> 258 </div>
244 </div> 259 </div>
245 - 260 + <script>
261 + // 지도 구현 부분
262 + </script>
263 +
264 +
246 <div id="map" style="width:600px;height:400px;"></div> 265 <div id="map" style="width:600px;height:400px;"></div>
247 266
248 <script> 267 <script>
......