지창언

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 + //변수 설정
67 + userData = data;
68 + },
69 + })
70 + var markers = [];
71 + var infomations =[];
62 var result_str=""; 72 var result_str="";
63 var routeCode = ""; 73 var routeCode = "";
64 var svarAddr = ""; 74 var svarAddr = "";
65 - var count = data["list"].length; 75 + var rest_name = "";
76 + var data_count = userData["list"].length // 데이터 개수 얻기
66 77
67 - for (var i =0; i<count; i++){ 78 + for (var i =0; i<data_count; i++){
68 - routeCode = JSON.stringify(data["list"][i]["routeCode"]); 79 + routeCode = JSON.stringify(userData["list"][i]["routeCode"]);
69 - svarAddr = JSON.stringify(data["list"][i]["svarAddr"]); 80 + svarAddr = JSON.stringify(userData["list"][i]["svarAddr"]);
70 - if(routeCode.substring(1,5) === lineNumber){ 81 + rest_name = JSON.stringify(userData["list"][i]["serviceAreaName"]);
71 - document.getElementById("testArea").innerHTML += routeCode.substring(1,5)+ " "; 82 +
72 - var geocoder = new kakao.maps.services.Geocoder(); 83 + if(routeCode.substring(1,5) === lineNumber){ // 고속도로 코드가 같다면
73 84
85 + var geocoder = new kakao.maps.services.Geocoder();
74 // 주소로 좌표를 검색합니다 86 // 주소로 좌표를 검색합니다
75 geocoder.addressSearch(svarAddr, function(result, status) { 87 geocoder.addressSearch(svarAddr, function(result, status) {
76 -
77 // 정상적으로 검색이 완료됐으면 88 // 정상적으로 검색이 완료됐으면
78 if (status === kakao.maps.services.Status.OK) { 89 if (status === kakao.maps.services.Status.OK) {
79 - 90 + //위치 저장
80 var coords = new kakao.maps.LatLng(result[0].y, result[0].x); 91 var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
81 92
82 - // 결과값으로 받은 위치를 마커로 표시합니다
83 var marker = new kakao.maps.Marker({ 93 var marker = new kakao.maps.Marker({
84 - map: map, 94 + position: coords,
85 - position: coords 95 + map: map
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 }); 96 });
92 - document.getElementById("position_ex").innerHTML = svarAddr; 97 + markers.push(marker); // markers 로 정상적 push 수행 안됨
93 - infowindow.open(map, marker);
94 } 98 }
95 }); 99 });
96 - }
97 100
98 } 101 }
99 - }, 102 + }
100 - }) 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,11 +111,16 @@ ...@@ -106,11 +111,16 @@
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();
...@@ -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);
135 + var temp = i
125 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,11 +160,16 @@ ...@@ -150,11 +160,16 @@
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();
...@@ -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);
184 + var temp = i
169 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,6 +257,10 @@ ...@@ -242,6 +257,10 @@
242 </div> 257 </div>
243 </div> 258 </div>
244 </div> 259 </div>
260 + <script>
261 + // 지도 구현 부분
262 + </script>
263 +
245 264
246 <div id="map" style="width:600px;height:400px;"></div> 265 <div id="map" style="width:600px;height:400px;"></div>
247 266
......