कई ओपन सोर्स लाइब्रेरी Maps JavaScript API को ज़्यादा सुविधाएं देने के लिए उपलब्ध हैं. इन लाइब्रेरी का वर्शन GitHub पर बनाया गया है और इन्हें npm पर पब्लिश किया गया है.
वेब कॉम्पोनेंट
अपनी वेबसाइटों पर मैप की सुविधा तुरंत जोड़ने के लिए, Maps JavaScript API वेब कॉम्पोनेंट का इस्तेमाल करें. वेब कॉम्पोनेंट में बॉयलरप्लेट कोड, सबसे सही तरीके, और रिस्पॉन्सिव डिज़ाइन शामिल होते हैं. इससे जटिल मैप यूआई को कम करके एक ही एचटीएमएल एलिमेंट में रखा जा सकता है.
एक्सटेंडेड कॉम्पोनेंट लाइब्रेरी (बीटा)
Google Maps Platform की एक्सटेंडेड कॉम्पोनेंट लाइब्रेरी, वेब कॉम्पोनेंट का एक सेट होती है जो कम समय में और कम मेहनत में बेहतर मैप बनाने में डेवलपर की मदद करती है.
npm i @googlemaps/extended-component-library
एपीआई लोड हो रहा है
Maps JavaScript API को लोड करने के लिए, आधुनिक वेब ऐप्लिकेशन को इन लाइब्रेरी का इस्तेमाल करने से फ़ायदा हो सकता है.
JS एपीआई लोडर
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 का इस्तेमाल करना
प्रतिक्रिया देने वाले उपयोगकर्ता, इन पैकेज का इस्तेमाल शुरू कर सकते हैं.
रिऐक्ट रैपर
Maps JavaScript API को एलान के तौर पर लोड करने के लिए रैपर कॉम्पोनेंट.
npm i @googlemaps/react-wrapper
प्रतिक्रिया वाले कॉम्पोनेंट (ऐल्फ़ा)
React ऐप्लिकेशन में इंटिग्रेट करने के लिए कॉम्पोनेंट और हुक.
npm i -D @vis.gl/react-google-maps
मार्कर और ओवरले को बढ़ाना
इन लाइब्रेरी में मार्कर और ओवरले व्यू जैसी क्लास भी शामिल हैं.
मार्कर क्लस्टर
बड़ी मात्रा में मार्कर के लिए, हर ज़ूम-लेवल क्लस्टर बनाता और मैनेज करता है.
npm i @googlemaps/markerclusterer
मार्कर मैनेजर
मैप व्यूपोर्ट में बदलाव के आधार पर मार्कर जोड़ता और हटाता है.
npm i @googlemaps/markermanager
वेब मैप सेवा (WMS)
मैप में, वेब मैप सर्विस (WMS) जैसी ओपन जियोस्पेशियल कंसोर्टियम (OGC) लेयर जोड़ें.
npm i @googlemaps/ogc
मार्कर लेबल
मार्कर में कस्टम एचटीएमएल लेबल जोड़ें.
npm i @googlemaps/markerwithlabel
Think.js ओवरले
बेहतर परफ़ॉर्मेंस के विज़ुअलाइज़ेशन के लिए, WebGL और ThreeJS का इस्तेमाल करें.
npm i @googlemaps/three
Deck.gl ओवरले
Google Maps के कस्टम ओवरले के तौर पर, Deck.gl का इस्तेमाल करें.
npm i @deck.gl/google-maps
टेस्टिंग और लिंटिंग
सबसे सही तरीके पक्का करने और Maps JavaScript API की जांच को आसान बनाने के लिए, इन लाइब्रेरी का इस्तेमाल करें.
ESLint प्लगिन
अपने कोड को लिंट करने के लिए, पसंद के मुताबिक बनाए गए ESLint नियमों का इस्तेमाल करें.
npm i -D eslint-plugin-googlemaps
जेस्ट मॉक
Jest टेस्टिंग लाइब्रेरी के साथ इस्तेमाल करने के लिए मॉक.
npm i -D @googlemaps/jest-mocks
Node.js लाइब्रेरी
Node.js क्लाइंट लाइब्रेरी
क्लाउड फ़ंक्शन या सर्वर साइड कोड से कॉल करने के लिए Node.js क्लाइंट लाइब्रेरी.
npm i @googlemaps/google-maps-services-js
पॉलीलाइन एन्कोडिंग
Node.js में, पॉलीलाइन को कोड में बदलें और उन्हें डिकोड करें.
npm i @googlemaps/polyline-codec
यूआरएल साइनिंग
ज़्यादा सुरक्षा के लिए, Node.js में यूआरएल साइन करें.
npm i @googlemaps/url-signature