// 지도를 생성합니다
var map = new kakao.maps.Map(mapContainer, mapOption);
var positions = [
{
address:'충남 부여군 부여읍 석탑로 49 문광사서점',
text: '문광사서점'
},
{
address:'충남 부여군 부여읍 성왕로 215 카페써니',
text: '카페써니'
},
{
address:'충남 부여군 부여읍 중앙로 10 추성희헤어스투디오',
text: '추성희헤어스투디오'
}
,{
address:'충남 부여군 부여읍 중앙로 7 리헤어리더',
text:'리헤어리더'
}
];
for (var i = 0; i < positions.length; i ++) {
// 주소-좌표 변환 객체를 생성합니다
var geocoder = new kakao.maps.services.Geocoder();
// 주소로 좌표를 검색합니다
geocoder.addressSearch(positions[i].address, function(result, status) {
// 정상적으로 검색이 완료됐으면
if (status === kakao.maps.services.Status.OK) {
var coords = new kakao.maps.LatLng(result[0].y, result[0].x);
// 결과값으로 받은 위치를 마커로 표시합니다
var marker = new kakao.maps.Marker({
map: map,
position: coords
});
// 마커에 표시할 인포윈도우를 생성합니다
var infowindow = new kakao.maps.InfoWindow({
//content: positions[i].content // 인포윈도우에 표시할 내용
content: '<div style="width:150px;text-align:center;padding:6px 0;">'+positions[i].text+'</div>' // 인포윈도우에 표시할 내용
});
//infowindow.open(map, marker);
kakao.maps.event.addListener(marker, 'mouseover', makeOverListener(map, marker, infowindow));
kakao.maps.event.addListener(marker, 'mouseout', makeOutListener(infowindow));
// 지도의 중심을 결과값으로 받은 위치로 이동시킵니다
//map.setCenter(coords);
}
});
}
위와 같이 리스트에 저장된 여러개 주소를 좌표 변경해 지도에 출력까지는 해결 했습니다.
리스트에 있는 가게 이름이 인포윈도우로 뜨게하려고 하는데 마지막 상점 이름이 모든 인포 윈도우에 출력됩니다.
이경우에는 해결해야 하는 방법이 뭐가 있을까요
