SIR
목록으로

네이버 지도 api 여러개 연동하기 채택완료

midal
프로필 보기이 회원 글보기이 회원의 댓글보기
 5년 전 조회 2,458
답변 2
목록

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

Copy 
<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>

이게 첫번째 지도고

Copy 
<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개

채택된 답변
+20 포인트

Copy 
<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>
로그인 후 평가할 수 있습니다

댓글을 작성하려면 로그인이 필요합니다.

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

 

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

로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

제가 개발자가 아니라서ㅠㅠ어느 부분을 변경하면 되나요??

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고