Maps JavaScript API के लिए अतिरिक्त सुविधाएं देने के लिए, कई ओपन सोर्स लाइब्रेरी उपलब्ध हैं. इन लाइब्रेरी के वर्शन GitHub पर तैयार किए जाते हैं और इन्हें npm पर पब्लिश किया जाता है.
वेब कॉम्पोनेंट
अपनी वेबसाइटों पर मैप की फ़ंक्शनलिटी तुरंत जोड़ने के लिए, Maps JavaScript API के वेब कॉम्पोनेंट का इस्तेमाल करें. वेब कॉम्पोनेंट में बॉयलरप्लेट कोड, सबसे सही तरीकों, और रिस्पॉन्सिव डिज़ाइन को इनकैप्सुलेट किया जाता है. इससे मैप के मुश्किल यूआई कम हो जाते हैं, जो एक एचटीएमएल एलिमेंट के रूप में बेहतर काम करते हैं.
एक्सटेंडेड कॉम्पोनेंट लाइब्रेरी (बीटा)
Google Maps Platform एक्सटेंडेड कॉम्पोनेंट लाइब्रेरी, वेब कॉम्पोनेंट का एक सेट है. इसकी मदद से डेवलपर, कम मेहनत और तेज़ी से बेहतर मैप बनाने में मदद करते हैं.
npm i @googlemaps/extended-component-library
एपीआई लोड हो रहा है
आधुनिक वेब ऐप्लिकेशन को Maps JavaScript API को लोड करने के लिए, नीचे दी गई लाइब्रेरी का इस्तेमाल करने से फ़ायदा हो सकता है.
JS API लोडर
प्रॉमिस के साथ 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 का इस्तेमाल करना
प्रतिक्रिया देने वाले उपयोगकर्ता, इन पैकेज का इस्तेमाल कर सकते हैं.
Google Maps लाइब्रेरी पर प्रतिक्रिया दें
Maps JavaScript API को React ऐप्लिकेशन में इंटिग्रेट करने के लिए कॉम्पोनेंट और हुक.
npm i -D @vis.gl/react-google-maps
प्रतिक्रिया वाला रैपर
Maps JavaScript API को एलान के तौर पर लोड करने के लिए एक रैपर कॉम्पोनेंट.
npm i @googlemaps/react-wrapper
मार्कर और ओवरले को बढ़ाना
नीचे दी गई लाइब्रेरी, मार्कर और OverlayView जैसी क्लास को बढ़ाती हैं.
मार्कर क्लस्टर
ज़्यादा मार्कर के लिए, हर ज़ूम-लेवल के क्लस्टर बनाता और मैनेज करता है.
npm i @googlemaps/markerclusterer
मार्कर मैनेजर
मैप व्यूपोर्ट में बदलावों के आधार पर मार्कर जोड़ता है और हटाता है.
npm i @googlemaps/markermanager
वेब मैप सेवा (WMS)
किसी मैप में, Web Map Service (WMS) जैसी ओपन जियोस्पेशियल कंसोर्टियम (OGC) लेयर जोड़ें.
npm i @googlemaps/ogc
मार्कर लेबल
मार्कर में कस्टम एचटीएमएल लेबल जोड़ें.
npm i @googlemaps/markerwithlabel
तीन.js ओवरले
बेहतर परफ़ॉर्म करने वाले विज़ुअलाइज़ेशन के लिए WebGL और तीन जेएस का इस्तेमाल करें.
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