開放原始碼資料庫

有許多開放原始碼程式庫都能為 Maps JavaScript API 提供額外功能。這些程式庫是在 GitHub 上進行版本管理，並發布至 npm。

網頁元件

使用 Maps JavaScript API 網頁元件，即可在網站中快速加入地圖功能。網頁元件包含樣板程式碼、最佳做法和回應式設計，可將複雜的地圖 UI 簡化為單一 HTML 元素。

擴充元件程式庫 (Beta 版)

Google 地圖平台擴充元件程式庫是一組網頁元件，可協助開發人員更快速、輕鬆地製作出色的地圖。

npm i @googlemaps/extended-component-library

載入 API

現代化的網頁應用程式可能適合使用下列程式庫載入 Maps JavaScript API。

JS API 載入器

使用 Promise 動態載入 Maps JavaScript API。

npm i @googlemaps/js-api-loader

使用 TypeScript

TypeScript 使用者可以從下列套件入門。詳情請參閱 TypeScript 使用指南。

TypeScript 類型

Maps JavaScript API 的 TypeScript 類型

npm i -D @types/google.maps

TypeScript 防護

用於限定聯合型別的 TypeScript 防護。

npm i -D @googlemaps/typescript-guards

使用 React

React 使用者可以從下列套件入門。

React 包裝函式

透過宣告方式載入 Maps JavaScript API 的包裝函式元件。

npm i @googlemaps/react-wrapper

React 元件 (Alpha 版)

這些元件和掛鉤可將 Maps JavaScript API 整合到 React 應用程式。

npm i -D @vis.gl/react-google-maps

擴充標記和疊加層

下列程式庫會擴充類別，例如 Marker 和 OverlayView。

標記叢集

針對大量標記建立和管理各縮放等級的叢集。

npm i @googlemaps/markerclusterer

標記管理工具

根據地圖可視區域變更來新增和移除標記。

npm i @googlemaps/markermanager

網頁地圖參照服務 (WMS)

在地圖中加入開放地理空間協會 (OGC) 圖層，例如網頁地圖參照服務 (WMS)。

npm i @googlemaps/ogc

標記標籤

在標記中加入自訂 HTML 標籤。

npm i @googlemaps/markerwithlabel

Three.js 疊加層

使用 WebGL 和 ThreeJS 來實現高效能視覺化。

npm i @googlemaps/three

Deck.gl 疊加層

使用 Deck.gl 做為自訂 Google 地圖疊加層。

npm i @deck.gl/google-maps

測試與程式碼檢查

使用這些程式庫來確保符合最佳做法，以及簡化 Maps JavaScript API 測試。

ESLint 外掛程式

使用自訂 ESLint 規則檢查程式碼。

npm i -D eslint-plugin-googlemaps

Jest 模擬

與 Jest 測試程式庫搭配使用的模擬。

npm i -D @googlemaps/jest-mocks

Node.js 程式庫

注意：下列程式庫是針對 Node.js 和伺服器環境實作，無法在瀏覽器環境中運作。

Node.js 用戶端程式庫

可用於從 Cloud Functions 或伺服器端程式碼發出呼叫的 Node.js 用戶端程式庫。

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

折線編碼

在 Node.js 中編碼和解碼折線。

npm i @googlemaps/polyline-codec

網址簽署

在 Node.js 中簽署網址，以提高安全性。

npm i @googlemaps/url-signature