ओपन सोर्स लाइब्रेरी

कई ओपन सोर्स लाइब्रेरी Maps JavaScript एपीआई. इन लाइब्रेरी के वर्शन GitHub पर और इसमें प्रकाशित किया गया है एनपीएम.

वेब कॉम्पोनेंट

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 क्लाइंट लाइब्रेरी

Node.js क्लाइंट लाइब्रेरी का इस्तेमाल, क्लाउड फ़ंक्शन या सर्वर साइड कोड से कॉल करने के लिए किया जाता है.

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

पॉलीलाइन एन्कोडिंग

Node.js में पॉलीलाइन को कोड में बदलना और डिकोड करना.

npm i @googlemaps/polyline-codec

यूआरएल साइनिंग

ज़्यादा सुरक्षा के लिए, Node.js में यूआरएल साइन करें.

npm i @googlemaps/url-signature