إشعار: يجب
إثبات أهلية جميع المشاريع غير التجارية المسجّلة لاستخدام Earth Engine قبل
15 أبريل 2025 من أجل الحفاظ على إمكانية الوصول إلى Earth Engine.
واجهة برمجة تطبيقات واجهة مستخدِم Earth Engine
تنظيم صفحاتك في مجموعات
يمكنك حفظ المحتوى وتصنيفه حسب إعداداتك المفضّلة.
توفّر أداة Earth Engine إمكانية الوصول إلى التطبيقات المصغّرة لواجهة المستخدم (UI) من جهة العميل من خلال حزمة
ui. استخدِم حزمة ui لإنشاء واجهة رسومية
لبرامجك النصية في Earth Engine. يمكن أن تتضمّن هذه الواجهات تطبيقات مصغّرة بسيطة لتلقّي الإدخال، مثل الأزرار ومربّعات الاختيار، وتطبيقات مصغّرة أكثر تعقيدًا، مثل الرسوم البيانية والخرائط، ولوحات للتحكّم في تنسيق واجهة المستخدم، ومعالجات الأحداث للتفاعلات بين تطبيقات واجهة المستخدم المصغّرة. يمكنك استكشاف الوظائف الكاملة لواجهة برمجة التطبيقات ui في علامة التبويب
المستندات على يمين "أداة تعديل الرموز". يستخدم المثال التالي
حزمة ui لتوضيح الدوالّ الأساسية لإنشاء تطبيق مصغّر وتحديد
السلوك الذي يحدث عندما ينقر المستخدم على التطبيق المصغّر وعرضه.
مرحبًا بالجميع!
يمثّل هذا المثال واجهة مستخدم بسيطة لزرّ معروض في وحدة التحكّم. يؤدي النقر على الزر
إلى طباعة "مرحبًا، يا عالم!" في وحدة التحكّم:
محرِّر الرموز البرمجية (JavaScript)
// Make a button widget.
var button = ui.Button('Click me!');
// Set a callback function to run when the
// button is clicked.
button.onClick(function() {
print('Hello, world!');
});
// Display the button in the console.
print(button);
لاحظ أنّه أولاً، يتم إنشاء الزر باستخدام وسيطة واحدة: تصنيفه. بعد ذلك،
يتم استدعاء الدالة onClick() للزر. وسيطة دالة
onClick() هي دالة أخرى سيتم تنفيذها عند
النقر على الزر. تُعرف آلية الدالة التي سيتمّ استدعاؤها (دالة "ردّ اتصال") عند حدوث
حدث باسم "معالج الحدث"، ويتم استخدامها على نطاق واسع في مكتبة واجهة المستخدم. في هذا
المثال، عند النقر على الزر، تطبع الدالة "مرحبًا، يا عالم!" في وحدة التحكّم.
قابلية التغيير
يُرجى العلم أنّه على عكس العناصر في مساحة الاسم ee.*، تكون العناصر في مساحة الاسم
ui.* قابلة للتغيير. وبالتالي، لا تحتاج إلى إعادة تعيين الكائن إلى متغيّر
في كل مرة تستدعي فيها دالة مثيل على الكائن. سيؤدي استدعاء الدالة
ببساطة إلى تغيير التطبيق المصغّر. يؤدي إلحاق الرمز البرمجي التالي بالمثال السابق
إلى تسجيل طلب استدعاء آخر لحدث النقر على الزر:
محرِّر الرموز البرمجية (JavaScript)
// Set another callback function on the button.
button.onClick(function() {
print('Oh, yeah!');
});
انسخ هذا الرمز إلى نهاية المثال السابق وانقر على تشغيل. الآن،
عند النقر على الزر، يتم طباعة كلتا الرسالتَين في وحدة التحكّم.
استخدِم صفحات واجهة المستخدم للاطّلاع على مزيد من المعلومات عن إنشاء واجهات مستخدم للنصوص البرمجية في Earth Engine. تقدّم
صفحة التطبيقات المصغّرة جولة مرئية وتصف وظائف
التطبيقات المصغّرة الأساسية في حزمة ui. توضِّح صفحة "اللوحات
والتنسيقات" حاويات وتنسيقات المستوى الأعلى التي يمكنك استخدامها لتنظيم
التطبيقات المصغّرة وترتيبها. تحتوي صفحة "الأحداث" على تفاصيل حول ضبط
سلوك التطبيقات المصغّرة وتفاعلها في واجهة المستخدم.
إنّ محتوى هذه الصفحة مرخّص بموجب ترخيص Creative Commons Attribution 4.0 ما لم يُنصّ على خلاف ذلك، ونماذج الرموز مرخّصة بموجب ترخيص Apache 2.0. للاطّلاع على التفاصيل، يُرجى مراجعة سياسات موقع Google Developers. إنّ Java هي علامة تجارية مسجَّلة لشركة Oracle و/أو شركائها التابعين.
تاريخ التعديل الأخير: 2025-07-28 (حسب التوقيت العالمي المتفَّق عليه)
[null,null,["تاريخ التعديل الأخير: 2025-07-28 (حسب التوقيت العالمي المتفَّق عليه)"],[[["\u003cp\u003eEarth Engine's \u003ccode\u003eui\u003c/code\u003e package enables the creation of interactive graphical user interfaces (GUIs) for your Earth Engine scripts, incorporating various widgets like buttons, charts, and maps.\u003c/p\u003e\n"],["\u003cp\u003eUI widgets are mutable, allowing modification by directly calling their instance functions without reassignment.\u003c/p\u003e\n"],["\u003cp\u003eEvent handlers, such as \u003ccode\u003eonClick()\u003c/code\u003e, are utilized to define widget behavior in response to user interactions.\u003c/p\u003e\n"],["\u003cp\u003eThe provided example demonstrates a simple button that prints a message to the console when clicked.\u003c/p\u003e\n"],["\u003cp\u003eComprehensive documentation on UI widgets, panels, layouts, and events is accessible through Earth Engine's guide pages.\u003c/p\u003e\n"]]],[],null,["# Earth Engine User Interface API\n\nEarth Engine provides access to client-side user interface (UI) widgets through the\n`ui` package. Use the `ui` package to construct graphical\ninterfaces for your Earth Engine scripts. These interfaces can include simple input\nwidgets like buttons and checkboxes, more complex widgets like charts and maps, panels\nto control the layout of the UI, and event handlers for interactions between UI\nwidgets. Explore the full functionality of the `ui` API in the\n**Docs** tab on the left side of the Code Editor. The following example uses\nthe `ui` package to illustrate basic functions for making a widget, defining\nbehavior for when the user clicks the widget, and displaying the widget.\n\nHello, world!\n-------------\n\nThis example represents a simple UI of a button displayed in the console. Clicking the\nbutton results in 'Hello, world!' getting printed to the console:\n\n### Code Editor (JavaScript)\n\n```javascript\n// Make a button widget.\nvar button = ui.Button('Click me!');\n\n// Set a callback function to run when the\n// button is clicked.\nbutton.onClick(function() {\n print('Hello, world!');\n});\n\n// Display the button in the console.\nprint(button);\n```\n\nObserve that first, the button is created with a single argument: its label. Next,\nthe button's `onClick()` function is called. The argument to\n`onClick()` is another function that will get run whenever the button is\nclicked. This mechanism of a function to be called (a \"callback\" function) when an\nevent happens is called an \"event handler\" and is used widely in the UI library. In this\nexample, when the button is clicked, the function prints 'Hello, world!' to the console.\n\nMutability\n----------\n\nNote that unlike objects in the `ee.*` namespace, objects within the\n`ui.*` namespace are mutable. So you don't need to reassign the object to a\nvariable every time you call an instance function on the object. Simply calling the\nfunction will mutate (change) the widget. Appending the following code to the previous\nexample results in registering another callback for the button's click event:\n\n### Code Editor (JavaScript)\n\n```javascript\n// Set another callback function on the button.\nbutton.onClick(function() {\n print('Oh, yeah!');\n});\n```\n\nCopy this code to the end of the previous example and click **Run**. Now\nwhen you click the button, both messages are printed to the console.\n\nUse the UI pages to learn more about building UIs for your Earth Engine scripts. The\n[Widgets page](/earth-engine/guides/ui_widgets) provides a visual tour and describes basic\nfunctionality of the widgets in the `ui` package. The [Panels\nand Layouts page](/earth-engine/guides/ui_panels) describes top-level containers and layouts you can use to organize\nand arrange widgets. The [Events page](/earth-engine/guides/ui_events) has details on configuring\nthe behavior and interaction of widgets in your UI."]]
