مكتبات برامج مفتوحة المصدر

تتوفّر العديد من المكتبات المفتوحة المصدر لتوفير إمكانات إضافية لواجهة برمجة التطبيقات Maps JavaScript API. يتم تحديد إصدارات هذه المكتبات في GitHub وتم نشرها في npm.

مكوّنات الويب

استخدام واجهة برمجة تطبيقات JavaScript للخرائط على الويب المكونات لإضافة الخرائط بسرعة الوظائف إلى مواقع الويب لديك. تعمل Web Components على تجميع الرموز البرمجية المتكررة، وأفضل الممارسات، والتصميم السريع الاستجابة، ما يؤدي إلى تقليل واجهة المستخدم المعقدة للخريطة إلى ما هو فعالًا كعنصر HTML واحد.

المكوِّن الموسع لمنصة خرائط Google المكتبة هي مجموعة من مكونات الويب التي تساعد مطوري البرامج في إنشاء خرائط أفضل بشكل أسرع وبجهد أقل.

npm i @googlemaps/extended-component-library
إصدار NPM لـ @googlemaps/extended-component-library عمليات تنزيل NPM لحزمة @googlemaps/extended-component-library نجوم GitHub Repo نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

تحميل واجهة برمجة التطبيقات

قد تستفيد تطبيقات الويب الحديثة من استخدام المكتبات التالية لتحميل واجهة برمجة تطبيقات JavaScript للخرائط.

تحميل واجهة برمجة تطبيقات JavaScript للخرائط بشكل ديناميكي مع Promises

npm i @googlemaps/js-api-loader
إصدار NPM لـ @googlemaps/js-api-loader عمليات تنزيل NPM لحزمة @googlemaps/js-api-loader عدد النجوم التي حصل عليها مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

استخدام TypeScript

يمكن لمستخدمي TypeScript البدء باستخدام الحِزم التالية. راجِع استخدام دليل TypeScript للحصول على معلومات إضافية.

أنواع TypeScript لواجهة برمجة تطبيقات JavaScript للخرائط

npm i -D @types/google.maps
إصدار NPM لواجهة برمجة التطبيقات ‏@types/google.maps عمليات تنزيل NPM لـ @types/google.maps عدد النجوم في مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

يحمي TypeScript أنواع الاتحاد الضيقة.

npm i -D @googlemaps/typescript-guards
إصدار NPM لواجهة برمجة التطبيقات ‏@googlemaps/typescript-guards عمليات تنزيل NPM لـ @googlemaps/typescript-guards عدد النجوم في مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

استخدام React

يمكن لمستخدمي React البدء باستخدام الحِزم التالية.

مكونات وعناصر الجذب لدمج Maps JavaScript API في تطبيقات React.

npm i -D @vis.gl/react-google-maps
إصدار NPM لواجهة برمجة التطبيقات ‎@vis.gl/react-google-maps عمليات تنزيل NPM لواجهة برمجة التطبيقات @vis.gl/react-google-maps عدد النجوم التي حصل عليها مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

عنصر غلاف لتحميل Maps JavaScript API بشكل تعريفي

npm i @googlemaps/react-wrapper
إصدار NPM لـ @googlemaps/react-wrapper عمليات تنزيل NPM لـ @googlemaps/react-wrapper نجوم GitHub Repo نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

توسيع العلامات والعناصر التي تظهر فوق المحتوى

تُوسّع المكتبات التالية فئات مثل Marker وOverlayView.

تُنشئ هذه الطريقة مجموعات لكل مستوى تكبير وتدير كميات كبيرة من العلامات.

npm i @googlemaps/markerclusterer
إصدار NPM لواجهة برمجة التطبيقات ‎@googlemaps/markerclusterer عمليات تنزيل NPM لـ @googlemaps/markerclusterer عدد النجوم في مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

تُضيف هذه السمة العلامات وتزيلها استنادًا إلى التغييرات في مساحة العرض على الخريطة.

npm i @googlemaps/markermanager
إصدار NPM لواجهة برمجة التطبيقات ‎@googlemaps/markermanager عمليات تنزيل NPM لواجهة برمجة التطبيقات ‎@googlemaps/markermanager عدد النجوم في مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

إضافة طبقات الاتحاد الجغرافي المكاني المفتوح (OGC) مثل خدمة خريطة الويب (WMS) إلى الخريطة.

npm i @googlemaps/ogc
إصدار NPM لـ @googlemaps/ogc عمليات تنزيل NPM لـ @googlemaps/ogc عدد النجوم التي حصل عليها مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

إضافة تصنيفات HTML مخصصة إلى العلامات.

npm i @googlemaps/markerwithlabel
إصدار NPM لواجهة برمجة التطبيقات ‎@googlemaps/markerwithlabel عمليات تنزيل NPM لـ @googlemaps/markerwithlabel عدد النجوم التي حصل عليها مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

استخدام WebGL وThreeJS لعرض مرئيات عالية الأداء

npm i @googlemaps/three
إصدار NPM لـ @googlemaps/three عمليات تنزيل NPM لـ @googlemaps/three عدد النجوم في مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

استخدِم Deck.gl كعنصر مركّب مخصّص في "خرائط Google".

npm i @deck.gl/google-maps
إصدار NPM لـ @deck.gl/google-maps عمليات تنزيل NPM لواجهة برمجة التطبيقات ‏@deck.gl/google-maps نجوم GitHub Repo نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

الاختبار واستخدام أداة Lint

استخدم هذه المكتبات لضمان أفضل الممارسات وتسهيل عملية الاختبار لـ Maps JavaScript API.

يمكنك استخدام قواعد ESLint المخصّصة لإضافة النص البرمجي إلى نص برمجي.

npm i -D eslint-plugin-googlemaps
إصدار NPM لـ eslint-plugin-googlemaps عمليات تنزيل NPM لـ eslint-plugin-googlemaps نجوم GitHub Repo نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

نماذج وهمية لاستخدامها مع مكتبة اختبار Jest

npm i -D @googlemaps/jest-mocks
إصدار NPM لواجهة برمجة التطبيقات ‏@googlemaps/jest-mocks عمليات تنزيل NPM لمجموعة @googlemaps/jest-mocks عدد النجوم في مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

مكتبات Node.js

مكتبة برامج Node.js لإجراء الطلبات من دوال السحابة أو رمز من جهة الخادم.

npm i @googlemaps/google-maps-services-js
إصدار NPM لحزمة @googlemaps/google-maps-services-js عمليات تنزيل NPM لخدمة @googlemaps/google-maps-services-js نجوم GitHub Repo نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

ترميز الخطوط المتعددة وفك ترميزها في Node.js.

npm i @googlemaps/polyline-codec
إصدار NPM لـ @googlemaps/polyline-codec عمليات تنزيل NPM لـ @googlemaps/polyline-codec نجوم GitHub Repo نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord

توقيع عناوين URL في Node.js لتعزيز الأمان

npm i @googlemaps/url-signature
إصدار NPM لواجهة برمجة التطبيقات ‎@googlemaps/url-signature عمليات تنزيل NPM لواجهة برمجة التطبيقات ‎@googlemaps/url-signature عدد النجوم في مستودع GitHub نشاط الالتزام في GitHub (فرع) شوكة GitHub شارة خادم Discord