GL 생성 및 기본 동작

다른 서브 모듈(예: drawing, visualization)과 호환되지 않으니, GL 서브 모듈을 단독으로 사용해주세요.

GL 서브 모듈은 NAVER 지도 API v3에서 제공하는 서브 모듈 중 하나로, WebGL 렌더링으로 벡터맵을 제공합니다.

클라이언트 기기에 의존적이라서 CPU/GPU 사양이 낮은 경우 성능이 저하될 수 있습니다.
또한, 브라우저 하드웨어 가속을 비활성화하면 기존과 동일하게 이미지 타일 기반 지도를 표시합니다.
Internet Explorer 브라우저는 지원하지 않습니다.

GL 서브 모듈을 사용하면 다음과 같은 장점이 있습니다.

• 실수 단위 줌 레벨을 지원하여 부드러운 지도 확대/축소 가능
• 클라이언트 기기의 픽셀 비율(devicePixelRatio)을 고려한 선명한 렌더링 결과 제공
• 화면에 표시하는 다양한 속성을 동적으로 변경 가능

GL에 대한 다양한 예제는 GL 예제를 참고합니다.

서브 모듈 로드하기

GL을 사용하려면 GL 서브 모듈 JavaScript 파일을 로드해야 합니다. 파일 로드는 아래와 같이 진행합니다.
GL 서브 모듈을 사용하려면 NAVER 지도 API v3가 먼저 로드되어 있어야 합니다. 자세한 사항은 서브 모듈 시스템을 참고합니다.

NAVER 지도 API v3은 http와 https 프로토콜을 모두 지원합니다.

<script type="text/javascript" src="https://oapi.map.naver.com/openapi/v3/maps.js?ncpKeyId=YOUR_CLIENT_ID&submodules=gl"></script>

주요 변경 내용

실수형 줌 레벨

• 기존 지도: 정수
• 벡터맵 지도: 실수

기본 줌 레벨 변경

• 기존 지도: 16.
• 벡터맵 지도: 15. 기존 줌 레벨과 -1 차이가 있습니다.

줌 레벨 지원 범위

• 기존 지도: 6 ~ 21
• 벡터맵 지도: 5 ~ 20

줌 레벨 범례

GL(벡터맵)으로 전환하기

옵션 설정하기

GL 서브 모듈을 사용하기 위해 기존 MapOptions 객체를 확장하여 gl 옵션을 추가했습니다. 해당 옵션 값을 true 로 설정하면 벡터맵으로 렌더링됩니다.

var map = new naver.maps.Map('map', {
    gl: true,
    zoom: 15,
    center: new naver.maps.LatLng(37.5666103, 126.9783882)
});

Examples: GL 기본 예제