네이버지도에서 상황별 마커아이콘의 변경 방법
본문
안녕하세요.
오늘도 질답게시판에서 답변을 해주시는 고수분께 감사를 드립니다 ^____^
게시판의 wr_1에는 0과 1 값이 들어가 있습니다.
이 값에 따라 네이버 지도의 마커 아이콘을 바꾸려고 합니다.
for (var i = 0, ii = data.length; i < ii; i++) {
var spot = data[i],
latlng = new naver.maps.LatLng(spot.wr_5, spot.wr_4),
marker = new naver.maps.Marker({
position: latlng,
icon: {
url: '/img/marker_1.png', //마커 URL
size: new naver.maps.Size(40, 50), //마커 SIZE
origin: new naver.maps.Point(0, 0), // origin 기본값 (0, 0)
anchor: new naver.maps.Point(11, 35) // anchor 속성은 이미지의 중앙 하단 포인터를 기본값으로 설정
},
draggable: false
});
gnu_marker(i, marker, "<div class='gnu_div_info'><a href='/bbs/board.php?bo_table=shop&wr_id="+spot.wr_id+"'><img src='"+spot.thumb+"' class='logo' /><h2 class='subj'><i class='fa fa-h-square' aria-hidden='true'></i> "+spot.wr_subject+"</h2></a><div class='txt_boxs''><p><i class='fa fa-phone' aria-hidden='true'></i> " +spot.wr_1+"</p><p style='height:30px;'><i class='fa fa-map-marker' aria-hidden='true'></i> " +spot.shop_address+"</p></div></div>");
위 소스는 /img/marker_1.png 이미지를 마커로 사용하며
지도위의 마커를 클릭했을 때 <div class='gnu_div_info'>로 시작하는 레이어를 보여주고 있는 소스이고 현재 잘 동작하고 있습니다.
여기에 위에서 말씀드렸듯이 wr_1값에 따라 마커 이미지를 바꾸려고 하기 때문에
아래처럼 해봤습니다.
( 소스를 보고 통박으로 쓰고 봅니다..;;; )
for (var i = 0, ii = data.length; i < ii; i++) {
var spot = data[i],
if ( spot.clinic_type ==1){
clinic_icon = '/img/marker_1.png',
} else {
clinic_icon = '/img/marker_0.png',
}
latlng = new naver.maps.LatLng(spot.wr_5, spot.wr_4),
marker = new naver.maps.Marker({
position: latlng,
icon: {
url: 'clinic_icon', //마커 URL
size: new naver.maps.Size(40, 50), //마커 SIZE
origin: new naver.maps.Point(0, 0), // origin 기본값 (0, 0)
anchor: new naver.maps.Point(11, 35) // anchor 속성은 이미지의 중앙 하단 포인터를 기본값으로 설정
},
draggable: false
});
항상 언제나 늘 그러하듯이 당연히 동작을 안합니다 ㅠ_ㅠ
어떤 식으로 수정하면 원하는 결과를 얻을 수 있을까요?
도와주시면 감사하겠습니다. (^^)(__)
!-->
답변 2
'clinic_icon' 변수인데 ''를 넣으셨네요 빼보세요
아 성공했습니다.
쉼표가 아니고 세미콜론을 찍었어야 하는군요.
if ( spot.clinic_type ==1){
clinic_icon = '/img/marker_1.png';
} else {
clinic_icon = '/img/marker_0.png';
}
블랙캣님 감사드립니다.