Live Brilliant

google map api marker 본문

개발은 핵찜이야/SCRIPT

google map api marker

주인정 2013. 1. 2. 22:58
좌표 검색
http://maps.google.com/
마우스 우클릭 > 이곳이 궁금한가요? 클릭

<div id="map_canvas" style="border:1px solid #bbb; width:660px; height:470px; margin: 0 auto;"></div>


<script type="text/javascript" src="https://maps.google.com/maps/api/js?sensor=false"></script>

<script type="text/javascript">


    var loc= new google.maps.LatLng(37.566207,126.977925); //화면중심

    var seoul= new google.maps.LatLng(37.566207,126.977925); 마커표시좌표

    var image = new google.maps.MarkerImage('/images/company/logo.png',

   new google.maps.Size(40, 13)); /*아이콘 사이즈 */

    var marker;

    var map;


    GoogleMap = {

        /* 초기화. */

        initialize: function () {

            var mapOptions = {

                zoom: 17,

                mapTypeId: google.maps.MapTypeId.ROADMAP,

                center: loc

            };


            map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);


            marker = new google.maps.Marker({

                map: map,

                draggable: true,

                animation: google.maps.Animation.DROP,

                position: seoul,

                icon: image,

                title: 'Seoul'

            });

            google.maps.event.addListener(marker, 'click', toggleBounce);

        }

    }


    function toggleBounce() {


        if (marker.getAnimation() != null) {

            marker.setAnimation(null);

        } else {

            marker.setAnimation(google.maps.Animation.BOUNCE);

        }

    }


    $(document).click(function () {

        GoogleMap.initialize();

    });


    GoogleMap.initialize();

    

</script>


Comments