오픈소스 라이브러리

컬렉션을 사용해 정리하기 내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.

Maps JavaScript API를 위한 추가 기능을 제공하기 위해 많은 오픈소스 라이브러리를 사용할 수 있습니다. 이러한 라이브러리는 GitHub에서 버전이 지정되며 NPM에 게시됩니다.

API 로드

최신 웹 애플리케이션에서는 다음 라이브러리를 사용하여 Maps JavaScript API를 로드할 수 있습니다.

프로미스를 사용하여 Maps JavaScript API를 동적으로 로드하세요.

npm i @googlemaps/js-api-loader

Maps JavaScript API를 선언적으로 로드하는 래퍼 구성요소입니다.

npm i @googlemaps/react-wrapper

TypeScript 사용

TypeScript 사용자는 다음 패키지를 사용하여 시작할 수 있습니다. 자세한 내용은 TypeScript 사용 가이드를 확인하세요.

Maps JavaScript API용 TypeScript 유형

npm i -D @types/google.maps

TypeScript는 유니온 유형을 좁히도록 가드합니다.

npm i -D @googlemaps/typescript-guards

마커 및 오버레이 확장

다음 라이브러리는 Marker 및 OverlayView와 같은 클래스를 확장합니다.

많은 양의 마커에 대해 확대/축소 수준 클러스터를 생성하고 관리합니다.

npm i @googlemaps/markerclusterer

지도 표시 영역 변경에 따라 마커를 추가하고 삭제합니다.

npm i @googlemaps/markermanager

웹 지도 서비스 (WMS)와 같은 OGC (Open Geospatial Consortium) 레이어를 지도에 추가합니다.

npm i @googlemaps/ogc

마커에 맞춤 HTML 라벨을 추가합니다.

npm i @googlemaps/markerwithlabel

WebGL 및 ThreeJS를 사용하여 고성능 시각화

npm i @googlemaps/three

Deck.gl을 맞춤 Google 지도 오버레이로 사용합니다.

npm i @deck.gl/google-maps

테스트 및 린트 작업

이러한 라이브러리를 사용하면 권장사항을 확인하고 Maps JavaScript API를 더 쉽게 테스트할 수 있습니다.

맞춤 ESLint 규칙을 사용하여 코드를 린트합니다.

npm i -D eslint-plugin-googlemaps

Jest 테스트 라이브러리와 함께 사용할 모의 화면

npm i -D @googlemaps/jest-mocks

NodeJS 라이브러리

Cloud Functions 또는 서버 측 코드에서 호출하는 NodeJS 클라이언트 라이브러리

npm i @googlemaps/google-maps-services-js

NodeJS에서 다중선을 인코딩하고 디코딩합니다.

npm i @googlemaps/polyline-codec

NodeJS에서 URL에 서명하여 보안을 강화하세요.

npm i @googlemaps/url-signature