다중 마커 api 관련 질문입니다

// 마커가 표시될 위치
var markerPosition = [{
latlng : new daum.maps.LatLng(latitud,longitude)
},
{
latlng : new daum.maps.LatLng(35.15599042371284,129.0596379989205)
}
];

		for (var i = 0; i < markerPosition.length; i ++) {
							
		var imageSrc = 'http://t1.daumcdn.net/localimg/localimages/07/mapapidoc/marker_red.png', // 마커이미지의 주소입니다    
		imageSize = new kakao.maps.Size(64, 69), // 마커이미지의 크기입니다
		imageOption = {
			offset : new kakao.maps.Point(27, 69)
		}; // 마커이미지의 옵션입니다. 마커의 좌표와 일치시킬 이미지 안에서의 좌표를 설정합니다.

		// 마커의 이미지정보를 가지고 있는 마커이미지를 생성합니다
		var markerImage = new kakao.maps.MarkerImage(
				imageSrc, imageSize, imageOption), markerPosition = new kakao.maps.LatLng(
				latitud, longitude); // 마커가 표시될 위치입니다

		// 마커를 생성
		var marker = new daum.maps.Marker({
			position : markerPosition[i],latlng, // 마커를 표시할 위치
			image: markerImage // 마커이미지 설정
		});
		
};		

api 짬뽕이라 이러합니다만.
// 마커를 생성 부분에 position 안 마커를 표시할위치에 latlng 를 찾지를못합니다… 위치를 이리저리바꿔봐도 답이안나와 여쭙니다… (오픈api 예제를 토대로 한건데 잘안됩니다 ㅠㅠ)

먼저 첨부한 코드를 살펴보면

  1. markerPosition에서 선언부가 잘못되어 있습니다.
    latlng : new daum.maps.LatLng(latitud,longitude) 에서 lat, lng 값을 넣어주셔야 합니다.

  2. markerPosition 선언 부분에서도 latitude, longitude를 찾을 수 없어 에러가 납니다.
    배열의 latlng을 바로 불러서 사용해주세요.
    markerPosition = new kakao.maps.LatLng(latitud, longitude); // (X)
    markerPosition = markerPosition[i].latlng;(O)

  3. marker를 지도 위에 표출하는 marker.setMap(map); 을 호출해서 지도에 마커를 올려야합니다.

  4. daum과 kakao 선언이 혼용된 부분을 통일해주세요.
    daum으로도 사용 가능하지만 가급적 리브랜딩 된 kakao로 사용해주세요.

  5. 설명드린 부분을 정리한 코드 같이 첨부해드립니다.

    var markerPosition = [{    	
     	latlng : new kakao.maps.LatLng(35.15599042371284,129.0596379989205)
     }];
    
    for(var i=0; i<markerPosition.length; i++){
     var imageSrc = 'http://t1.daumcdn.net/localimg/localimages/07/mapapidoc/marker_red.png'; // 마커이미지의 주소입니다
     var imageSize = new kakao.maps.Size(64, 69); // 마커이미지의 크기입니다
     var imageOption = {
         offset : new kakao.maps.Point(27, 69)
     }; 
     var markerImage = new kakao.maps.MarkerImage(imageSrc, imageSize, imageOption);
     var markerPosition = markerPosition[i].latlng;
    
     var marker = new kakao.maps.Marker({
         position : markerPosition, // 마커를 표시할 위치
         image: markerImage // 마커이미지 설정
     });
    
     marker.setMap(map);
    

    }

1개의 좋아요

감사합니다 (__)

1개의 좋아요