For 문 i값 전달 오류

지도/로컬 API
,
#1

image
image

모달에 각 장소에 따라서 클릭하면 이미지 띄울려고 for문 돌렸는데
i가
image
여기서 markers[i]까지는 되는데
내부에 data[i][2]여기에는 전달이 안되서 undefine됩니다ㅠㅠ
어떻게 방법이 없을까요?

      for (var i = 0; i < data.length; i++) {
		// 지도에 마커를 생성하고 표시한다
		var marker = new kakao.maps.Marker({
			position: new kakao.maps.LatLng(data[i][0], data[i][1]), // 마커의 좌표	(0 , 1  -->  위도 경도 컬럼 순서)
			image: markerImage,
			map: map, // 마커를 표시할 지도 객체
			yAnchor: 1

		});

		// 마커가 지도 위에 표시되도록 설정합니다
		marker.setMap(map);

.2번 for문 내부

        const close = document.getElementById("close");
		const modal = document.querySelector(".modal_wrapper");
		const content = document.querySelector(".modal_content");

		kakao.maps.event.addListener(markers[i], 'click', function () {
			modal.style.display = "flex";
			content.innerText = data[i][2]
		})

		close.addEventListener('click', function () {
			modal.style.display = "none";
		})
	}

데이터 정보 일부입니다

`var data = [
		[35.04755363814959, 126.96797841240902, '<div style="padding:5px">이용대 체육관 앞</div>', '전남 화순군 화순읍 대리 481', 'https://mono3433.cdn2.cafe24.com/files/camping/2021/01/04/a9168eb389691ef7f376dc675dda2a65_160.jpg'],
		[35.02005812729978, 126.85504446935549, '<div style="padding:5px">나주 드들강 솔밭유원지 주차장 부근</div>', '전남 나주시 남평읍 남석리 779', 'https://www.5gcamp.com/modules/camping/theme/_pc/default//image/blank.gif'],
		[35.01814851192320, 126.85425621564983, '<div style="padding:5px">나주 드들강 솔밭유원지 내</div>', '전남 나주시 남평읍 남석리 779', 'https://www.5gcamp.com/files/camping/2017/12/25/6bbb42965e27afcb0f2f2771b2a4ceb0_160.jpg'],
		[35.27924244410099, 126.95134482421850, '<div style="padding:5px">담양 오례천변</div>', '전남 담양군 봉산면 제월리 793-7', 'https://mono3433.cdn2.cafe24.com/files/camping/2019/07/11/0bd3b9b1bf03b16e899907734823655f_160.jpg'],
		[35.01284517222297, 126.85916022725117, '<div style="padding:5px">나주 지석천 낚시 캠핑</div>', '전남 나주시 남평읍 남석리 901', 'https://www.5gcamp.com/files/camping/2018/03/26/b719e7761b28a747c7098b3001e51328_160.jpg'],

`

#2

클로저 함수를 이용해서 마커 이벤트를 등록해주세요.

var data = [
    [35.04755363814959, 126.96797841240902, '<div style="padding:5px">이용대 체육관 앞</div>', '전남 화순군 화순읍 대리 481', 'https://mono3433.cdn2.cafe24.com/files/camping/2021/01/04/a9168eb389691ef7f376dc675dda2a65_160.jpg'],
    [35.02005812729978, 126.85504446935549, '<div style="padding:5px">나주 드들강 솔밭유원지 주차장 부근</div>', '전남 나주시 남평읍 남석리 779', 'https://www.5gcamp.com/modules/camping/theme/_pc/default//image/blank.gif'],
    [35.01814851192320, 126.85425621564983, '<div style="padding:5px">나주 드들강 솔밭유원지 내</div>', '전남 나주시 남평읍 남석리 779', 'https://www.5gcamp.com/files/camping/2017/12/25/6bbb42965e27afcb0f2f2771b2a4ceb0_160.jpg'],
    [35.27924244410099, 126.95134482421850, '<div style="padding:5px">담양 오례천변</div>', '전남 담양군 봉산면 제월리 793-7', 'https://mono3433.cdn2.cafe24.com/files/camping/2019/07/11/0bd3b9b1bf03b16e899907734823655f_160.jpg'],
    [35.01284517222297, 126.85916022725117, '<div style="padding:5px">나주 지석천 낚시 캠핑</div>', '전남 나주시 남평읍 남석리 901', 'https://www.5gcamp.com/files/camping/2018/03/26/b719e7761b28a747c7098b3001e51328_160.jpg'],
];

for (var i = 0; i < data.length; i++) {
    // 지도에 마커를 생성하고 표시한다
    var marker = new kakao.maps.Marker({
        position: new kakao.maps.LatLng(data[i][0], data[i][1]), // 마커의 좌표	(0 , 1  -->  위도 경도 컬럼 순서)
        image: markerImage,
        map: map, // 마커를 표시할 지도 객체
        yAnchor: 1

    });

    // 마커가 지도 위에 표시되도록 설정합니다
    marker.setMap(map);

    // 클로저 함수를 이용해서 마커 이벤트를 등록합니다.
    (function(marker, text) {
        kakao.maps.event.addListener(marker, 'click', function () {
            console.log(text);
        });
    })(marker, data[i][2]);
}
1개의 좋아요
#3

감사합니다ㅠㅠ