Accel.
243
2021-10-13 09:52:42 작성 2021-10-13 09:55:01 수정됨
3
160

자바스크립트 반복문 질문 있어요



                  let markers = [];
                  let marker = [];
                  let locations = [];

                  if (navigator.geolocation) {
                    navigator.geolocation.getCurrentPosition(success);
                  } else {
                    error('Geo Location is not supported');
                  }

                  function success(position) { // 현재 위치 


                    var location = new naver.maps.LatLng(position.coords.latitude,
                                       position.coords.longitude);

                                       marker = new naver.maps.Marker({
                                       position: new naver.maps.LatLng(location),
                                       map: map

                                   });
                                   markers.push(marker);

                                   map.setCenter(location)
                                   map.setZoom(17)
                  }

                  for(k=1;k<($("input[name='sel_tag']").length-1);k++){

                    $.ajax({
                    url:'/ajax/ajax.map.option.php',
                    data : {sel_tag:k
                    },
                    type : 'post',
                    success : function(data){
                    locations[k] = JSON.parse(data);


                    for (i = 0; i < locations[k].length; i++) {
                            marker[k][i] = new naver.maps.Marker({
                            position: new naver.maps.LatLng(locations[k][i][1], locations[k][i][2]),
                            map: map,
                            icon: {
                              url: '/img/marker/marker'+k+'.png', //마커 path
                              origin: new naver.maps.Point(0, 0),
                              anchor: new naver.maps.Point(14, 0)
                            }
                        });

                        markers.push(marker[k][i]);

                        naver.maps.Event.addListener(marker[k], 'click', (function (marker, i) {
                            return function () {
                              change_pos = new naver.maps.LatLng(parseFloat(locations[k][i][1]), parseFloat(locations[k][i][2]));
                              map.setZoom(19);
                              map.panTo(change_pos);
                            }
                        })(marker, i));

                        naver.maps.Event.addListener(marker[k], 'mouseover', (function (marker, i) {
                            return function () {
                                infowindow.setContent(locations[k][i][0]);
                                infowindow.open(map, marker);
                            }
                        })(marker, i));

                        naver.maps.Event.addListener(marker[k], 'mouseout', (function (marker, i) {
                            return function () {
                                infowindow.close(map, marker);
                            }
                        })(marker, i));
                    }
                  },
                  error:function(request,status,error){
                    alert("code:"+request.status+"\n"+"message:"+request.responseText+"\n"+"error:"+error);
                  }
                    });
                  }



이중 반복문으로 마커 처리를 하려는데요


표시해야할 마커는 8가지고 각 마커당 대충 10~20개 씩 좌표를 DB에 넣어두었습니다. 즉석으로 위도경도 가져오면 많이 느려지더라고요



Uncaught TypeError: Cannot set properties of undefined (setting '0')


이런 에러가 뜨는데 배열 참조할때 문제가 생긴것 같은데.. 어딜 고쳐야 될까요 인덱스 참조를 못한것 같은데..


개발자 도구로 보니까


marker[k][i] = new naver.maps.Marker({ 

이쪽에 하이라이트가 잡힙니다





0
  • 답변 3

  • iMac 0
    811
    2021-10-13 10:03:39

    new naver << 이게 따로 정의가 되어있는 생성자인가요?

  • Accel.
    243
    2021-10-13 10:08:58

    네 네이버 지도 참조했습니다

  • iMac 0
    811
    2021-10-13 10:54:33 작성 2021-10-13 10:55:51 수정됨

    일단 짧은 소견으론 marker[][] 2차원배열 객체가 제대로 초기화가 안돼서 marker[k][0]에서 에러가 나는 것 같습니다.

    해당 for문 바깥 바로 앞에서 marker object를 한번 찍어보면 좋을 것 같은데요

  • 로그인을 하시면 답변을 등록할 수 있습니다.