네이버 지도 api 여러개 연동하기

네이버 지도 api 여러개 연동하기

QA

네이버 지도 api 여러개 연동하기

본문

네이버 지도 api를 이용해서 한페이지에 지도 2개를 쓰려고 하니 처음꺼만 잘나오고 두번째꺼는 반만 잘리듯이 나오는데 소스 어디를 어떻게 변경해야할지 몰라서 여쭤봅니다ㅠㅠ


<div id="gmap"></div>
                            <script>
                                
                                //지도를 삽입할 HTML 요소 또는 HTML 요소의 id를 지정합니다.
                                var mapDiv = document.getElementById('gmap'); // 'map'으로 선언해도 동일
                                var HOME_PATH = window.HOME_PATH || '.';
                                var position = new naver.maps.LatLng(35.835614, 129.209786);
                                var map = new naver.maps.Map('gmap', {
                                    center: position,
                                    zoom: 19
                                });
                                var markerOptions = {
                                    position: position.destinationPoint(90, 15),
                                    map: map,
                                    icon: {
                                        url: HOME_PATH +'/img/map_icon.png',
                                        size: new naver.maps.Size(50, 52),
                                        origin: new naver.maps.Point(0, 0),
                                        anchor: new naver.maps.Point(25, 26)
                                    }
                                };
                                var marker = new naver.maps.Marker(markerOptions);
                            </script>

이게 첫번째 지도고


<div id="umap"></div>
                            <script>
                                
                                //지도를 삽입할 HTML 요소 또는 HTML 요소의 id를 지정합니다.
                                var mapDiv = document.getElementById('umap'); // 'map'으로 선언해도 동일
                                var HOME_PATH = window.HOME_PATH || '.';
                                var position = new naver.maps.LatLng(35.538289, 129.334081);
                                var map = new naver.maps.Map('umap', {
                                    center: position,
                                    zoom: 19
                                });
                                var markerOptions = {
                                    position: position.destinationPoint(90, 15),
                                    map: map,
                                    icon: {
                                        url: HOME_PATH +'/img/map_icon.png',
                                        size: new naver.maps.Size(50, 52),
                                        origin: new naver.maps.Point(0, 0),
                                        anchor: new naver.maps.Point(25, 26)
                                    }
                                };
                                var marker = new naver.maps.Marker(markerOptions);
                            </script>
 

이게 반만 나오는 두번째 지도입니다

이 질문에 댓글 쓰기 :

답변 2


<div id="umap"></div>
    <script>
        
        //지도를 삽입할 HTML 요소 또는 HTML 요소의 id를 지정합니다.
        var mapDiv_1 = document.getElementById('umap'); // 'map'으로 선언해도 동일
        var HOME_PATH = window.HOME_PATH || '.';
        var position_1 = new naver.maps.LatLng(35.538289, 129.334081);
        var map_1 = new naver.maps.Map('umap', {
            center: position_1,
            zoom: 19
        });
        var markerOptions_1 = {
            position: position_1.destinationPoint(90, 15),
            map: map_1,
            icon: {
                url: HOME_PATH +'/img/map_icon.png',
                size: new naver.maps.Size(50, 52),
                origin: new naver.maps.Point(0, 0),
                anchor: new naver.maps.Point(25, 26)
            }
        };
        var marker = new naver.maps.Marker(markerOptions_1);
    </script>

이렇게 한번 테스트해 보세요.  두번째 스크립트의 변수를 모두 변경해 보세요.

 

주소가 있으면 더 찍어 보기가 편할 것 같습니다. 

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

회원로그인

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