PG수수료에 대한 인식 조사, 설문에 참여하시고 스타벅스 기프티콘 받아가세요!

구글맵 마커 게시판 분류에 따라 다른 이미지 적용

구글맵 마커 게시판 분류에 따라 다른 이미지 적용

QA

구글맵 마커 게시판 분류에 따라 다른 이미지 적용

본문

안녕하세요.

항상 만들어진 스킨적용만 할줄알다가 요즘 스스로 수정을 시도하고 있는 중인데 벽에 부딪쳤습니다..

 

이윰 구글맵 다중마커 스킨을 사용하는중입니다.

게시판 분류에 따라 설정한 마커 이미지로 변경하고 싶은데 잘 안되네요.

아이콘에 대한 주소를 입력해주고 카테고리에 따라 마커를 지정해줘야 하는거 같은데 이 부분을 어디에 어떻게 추가하면 될까요?

 

빨간색부분이 추가한 부분인데 고수님들 도와주세요.

 

(function() {

    var $frame = $('#tab-category');

    var $wrap  = $frame.parent();

    $frame.sly({

        horizontal: 1,

        itemNav: 'centered',

        smart: 1,

        activateOn: 'click',

        mouseDragging: 1,

        touchDragging: 1,

        releaseSwing: 1,

        scrollBar: $wrap.find('.scrollbar'),

        scrollBy: 1,

        startAt: $frame.find('.active'),

        speed: 300,

        elasticBounds: 1,

        easing: 'easeOutExpo',

        dragHandle: 1,

        dynamicHandle: 1,

        clickBar: 1,

        prev: $wrap.find('.prev'),

        next: $wrap.find('.next')

    });

    var tabWidth = $('#tab-category').width();

    var categoryWidth = $('.category-list').width();

    if (tabWidth < categoryWidth) {

        $('.controls').show();

    }

});

</script>

<?php } ?>

 

<script>

$('#fakeloader').fakeLoader({

    timeToHide:3000,

    zIndex:"11",

    spinner:"spinner6",

    bgColor:"#fff",

});

 

$(window).load(function(){

    $('#fakeloader').fadeOut(300);

});

 

<?php if ($eyoom_board['bo_use_addon_map'] == '1') { ?>

(function(){

    var script = '<script type="text/javascript" src="<?php echo EYOOM_THEME_URL; ?>/skin/board/gmap/js/markerclusterer';

    if (document.location.search.indexOf('compiled') !== -1) {

        script += '_compiled';

    }

    script += '.js"><' + '/script>';

    document.write(script);

 

    var gm = google.maps;

    var config = {

        el: 'gmap_list_canvas',

        lat: 14.5995124,

        lon: 120.9842195,

        zoom: 8,

        minZoom: 15,

        type: google.maps.MapTypeId.ROADMAP

    };

    var spiderConfig = {

        keepSpiderfied: true,

        event: 'mouseover'

    };

    var icons = {

      한식: {

        icon: '<?php echo EYOOM_THEME_URL; ?>/skin/board/gmap/images/markerstar1.png'

  },

 

};

    function initialize() {

        var map = new gm.Map(document.getElementById(config.el), {

            zoom: config.zoom,

            center: new gm.LatLng(config.lat, config.lon),

            mapTypeId: config.type

        });

        var markerSpiderfier = new OverlappingMarkerSpiderfier(map, spiderConfig);

                

        var locations = [

            <?php $cnt = count((array)$list); for ($i=0; $i<$cnt; $i++) { ?>

            

            ['<?php echo $list[$i]['wr_7']; ?>','<?php echo $list[$i]['wr_8']; ?>']<?php echo $cnt != ($i+1) ? ',':''; ?>

            <?php } ?>

        ];

        var infoWindowContent = [

            <?php $cnt = count((array)$list); for ($i=0; $i<$cnt; $i++) { ?>

            [

                "<div class=\"info-content\">" +

                    "<a href=\"<?php echo $list[$i]['href']; ?>\"><h5 class=\"ellipsis margin-bottom-10\"><strong><?php echo $list[$i]['subject']; ?></strong></h5></a>" +

                    <?php if($list[$i]['img_content']) { ?>

                    "<div class=\"gmap-canvas-img\"><div class=\"gmap-canvas-img-in\"><a href=\"<?php echo $list[$i]['href']; ?>\">" +

                        '<?php echo $list[$i]['img_content']; ?>' +

                    "</a></div></div>" +

                    <?php } ?>

                    "<div class=\"gmap-canvas-info\">" +

                        <?php if ($list[$i]['wr_9']) { ?>

                        "<p class=\"font-size-11\">- <strong>위치명</strong> : <?php echo get_text($list[$i]['wr_9'], 0); ?></p>" +

                        <?php } ?>

                        <?php if ($list[$i]['wr_10']) { ?>

                        "<p class=\"font-size-11\">- <strong>연락처</strong> : <?php echo get_text($list[$i]['wr_10'], 0); ?></p>" +

                        <?php } ?>

                        "<p class=\"font-size-11\">- <strong>주소</strong> : <?php echo get_text($list[$i]['wr_6'], 0); ?></p>" +

                    "</div>" +

                "</div>"

            ]<?php echo $cnt != ($i+1) ? ',':''; ?>

            <?php } ?>

        ];

        var markers = [];

        var clusterStyles = [

            {

                textColor: 'white',

                url: '<?php echo EYOOM_THEME_URL; ?>/skin/board/gmap/images/mc1.png',

                height: 50,

                width: 50

            },

            {

                textColor: 'white',

                url: '<?php echo EYOOM_THEME_URL; ?>/skin/board/gmap/images/mc2.png',

                height: 50,

                width: 50

            },

            {

                textColor: 'white',

                url: '<?php echo EYOOM_THEME_URL; ?>/skin/board/gmap/images/mc3.png',

                height: 50,

                width: 50

            },

            {

                textColor: 'white',

                url: '<?php echo EYOOM_THEME_URL; ?>/skin/board/gmap/images/mc4.png',

                height: 50,

                width: 50

            },

            {

                textColor: 'white',

                url: '<?php echo EYOOM_THEME_URL; ?>/skin/board/gmap/images/mc5.png',

                height: 50,

                width: 50

            }

        ];

        var mcOptions = {

            styles: clusterStyles

        };

        var iw = new gm.InfoWindow();

        for (var i = 0; i < locations.length; i++) {

            var latLng = new gm.LatLng(locations[i][0], locations[i][1]);

            var marker = new gm.Marker({

                position: latLng,

                map: map

            

            });

            markers.push(marker);

            markerSpiderfier.addMarker(marker);

            gm.event.addListener(marker, 'click', (function(marker, i) {

                return function() {

                    iw.setContent(infoWindowContent[i][0]);

                    iw.open(map, marker);

                }

            })(marker, i));

        }

        var markerCluster = new MarkerClusterer(map, markers, mcOptions);

 

        markerCluster.setMaxZoom(config.minZoom);

    }

    gm.event.addDomListener(window, 'load', initialize);

 

    $('#gm_refresh').on('click', initialize);

})();

<?php } ?>

 

더 좋은 답변을 위해 필요한 추가정보를 요청해 보세요.

추가정보요청

이 질문에 댓글 쓰기 :

답변을 작성하시기 전에 로그인 해주세요.
전체 98,202 | RSS
QA 내용 검색

회원로그인

(주)에스아이알소프트 (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 대표메일:admin@sir.kr
사업자등록번호:217-81-36347 대표:홍석명 통신판매업신고번호:2014-서울강남-02098호 개인정보보호책임자:이총

© SIRSOFT