دليل تصنيف الصور للويب

تتيح لك مهمة مصنِّف صور MediaPipe تصنيف الصور. يمكنك استخدام هذه المهمة لتحديد ما تمثله الصورة بين مجموعة من الفئات المحددة في وقت التدريب. توضّح لك هذه التعليمات كيفية استخدام "مصنِّف الصور". لتطبيقات الويب والعقدة

يمكنك مشاهدة هذه المهمة وهي قيد التنفيذ من خلال عرض العرض التوضيحي. مزيد من المعلومات حول الإمكانات والنماذج وخيارات الضبط هذه المهمة، راجع نظرة عامة.

مثال على الرمز البرمجي

يقدّم الرمز البرمجي في نموذج "مصنِّف الصور" تنفيذًا كاملاً لهذه الطريقة المهمة في JavaScript كمرجع لك. يساعدك هذا الرمز في اختبار هذه المهمة وابدأ في إنشاء تطبيقك الخاص لتصنيف الصور. يمكنك عرض وتشغيل تعديل مثال على الرمز لأداة تصنيف الصور باستخدام متصفح الويب فقط.

ضبط إعدادات الجهاز

يصف هذا القسم الخطوات الرئيسية لإعداد بيئة التطوير لترميز الصور بشكل خاص لاستخدام أداة تصنيف الصور. للحصول على معلومات عامة عن إعداد بيئة التطوير الخاصة بك لاستخدام مهام MediaPipe، بما في ذلك متطلبات إصدار نظام التشغيل، راجع دليل إعداد المواقع الإلكترونية

حزم JavaScript

يتوفّر رمز مصنِّف الصور من خلال MediaPipe @mediapipe/tasks-vision. حزمة NPM. يمكنك البحث عن هذه المكتبات وتنزيلها من الروابط المتوفرة في النظام الأساسي دليل الإعداد.

يمكنك تثبيت الحِزم المطلوبة بالرمز البرمجي التالي للمراحل المحلية. باستخدام الأمر التالي:

npm install @mediapipe/tasks-vision

إذا كنت ترغب في استيراد رمز المهمة عبر شبكة توصيل المحتوى (CDN) أضف الرمز التالي في العلامة داخل ملف HTML:

<!-- You can replace JSDeliver with another CDN if you prefer to -->
<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
    crossorigin="anonymous"></script>
</head>

الطراز

تتطلب مهمة مصنِّف صور MediaPipe نموذجًا مدرَّبًا متوافقًا مع هذه المهمة. لمزيد من المعلومات حول النماذج المدرَّبة المتاحة في "أداة تصنيف الصور"، يُرجى الاطّلاع على نظرة عامة على المهمة قسم النماذج.

حدد نموذجًا ونزّله ثم خزّنه في دليل المشروع:

<dev-project-root>/app/shared/models/

إنشاء المهمة

يمكنك استخدام إحدى وظائف "مصنِّف الصور" createFrom...() من أجل: وتجهز المهمة لتشغيل الاستنتاجات. استخدام createFromModelPath() مع مسار نسبي أو مطلق لملف النموذج المدرَّب. إذا تم تحميل نموذجك في الذاكرة من قبل، يمكنك استخدام طريقة createFromModelBuffer().

يوضح مثال الرمز البرمجي أدناه استخدام الدالة createFromOptions() من أجل لإعداد المهمة. تسمح لك الدالة createFromOptions بتخصيص أداة تصنيف الصور مع خيارات الإعداد. لمزيد من المعلومات عن الإعدادات يمكنك الاطّلاع على خيارات الإعداد.

يوضح الرمز التالي كيفية إنشاء المهمة وإعدادها باستخدام الخيارات:

async function createImageClassifier {
  const vision = await FilesetResolver.forVisionTasks(
    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@0.10.0/wasm"
  );
  imageClassifier = await ImageClassifier.createFromOptions(vision, {
    baseOptions: {
      modelAssetPath: `https://storage.googleapis.com/mediapipe-models/image_classifier/efficientnet_lite0/float32/1/efficientnet_lite0.tflite`
    },
  });
}

خيارات الإعداد

تتضمّن هذه المهمة خيارات الضبط التالية لتطبيقات الويب:

اسم الخيار	الوصف	نطاق القيمة	القيمة الافتراضية
`runningMode`	لضبط وضع التشغيل للمهمة. هناك خياران وسائل النقل: IMAGE: وضع إدخالات الصورة الفردية فيديو: وضع الإطارات التي تم فك ترميزها مقطع فيديو أو بث مباشر لبيانات المدخلات، مثل من الكاميرا.	{`IMAGE, VIDEO`}	`IMAGE`
`displayNamesLocale`	لتعيين لغة التسميات لاستخدامها في الأسماء المعروضة المقدمة في بيانات التعريف لنموذج المهمة، إن وجد. القيمة التلقائية هي `en` لمدة الإنجليزية. يمكنك إضافة تصنيفات مترجَمة إلى البيانات الوصفية لنموذج مخصّص. باستخدام TensorFlow Lite Metadata Writer API	رمز اللغة	en
`maxResults`	لضبط الحد الأقصى الاختياري لنتائج التصنيف الأعلى تقييمًا إرجاع. إذا كانت قيمة 0، سيتم عرض جميع النتائج المتاحة.	أي أرقام موجبة	`-1`
`scoreThreshold`	لتعيين الحد الأدنى لنتيجة التنبؤ الذي يلغي الحد المقدم في بيانات التعريف للنموذج (إن وجدت). يتم رفض النتائج التي تكون أدنى من هذه القيمة.	أي عدد عائم	لم يتم ضبط الوضع
`categoryAllowlist`	تضبط هذه السياسة القائمة الاختيارية لأسماء الفئات المسموح بها. إذا لم تكن فارغة، سيتم وضع نتائج التصنيف التي لا يوجد اسم فئته بها في هذه المجموعة بفلترته. ويتم تجاهل أسماء الفئات المكرّرة أو غير المعروفة. لا يمكن لأحد الطرفين استخدام هذا الخيار إلا بعد استخدام `categoryDenylist`. يؤدي كلا الخيارين إلى خطأ.	أي سلاسل	لم يتم ضبط الوضع
`categoryDenylist`	تحدِّد هذه السياسة القائمة الاختيارية لأسماء الفئات غير المسموح بها. في حال حذف نتائج التصنيف التي يكون اسم فئتها في هذه المجموعة غير فارغة، ستتم فلترتها . ويتم تجاهل أسماء الفئات المكرّرة أو غير المعروفة. يتوفّر هذا الخيار حصرية مع `categoryAllowlist` واستخدام النتيجتين معًا إلى حدوث خطأ.	أي سلاسل	لم يتم ضبط الوضع
`resultListener`	تعمل هذه السياسة على ضبط أداة معالجة النتائج لتلقّي نتائج التصنيف. بشكل غير متزامن عندما يكون مصنِّف الصور في البث المباشر الحالي. لا يمكن استخدام الإذن إلا عند ضبط "وضع التشغيل" على `LIVE_STREAM`	لا ينطبق	لم يتم ضبط الوضع

تجهيز البيانات

بإمكان "مصنِّف الصور" تصنيف العناصر في الصور بأي تنسيق متوافق مع المضيف. تتعامل المهمة أيضًا مع المعالجة المسبقة لإدخال البيانات، بما في ذلك تغيير الحجم والتدوير وتسوية القيمة.

يتم تشغيل الطلبات إلى "مصنِّف الصور" classify() وclassifyForVideo(). بشكل متزامن وحظر مؤشر ترابط واجهة المستخدم. إذا قمت بتصنيف الكائنات في إطارات الفيديو من كاميرا الجهاز، فإن كل تصنيف سيحظر . ويمكنك منع ذلك من خلال تنفيذ موظفي الويب لتشغيل classify() وclassifyForVideo() في سلسلة محادثات أخرى.

تنفيذ المهمة

يستخدم مصنِّف الصور طريقة classify() مع وضع الصور طريقة classifyForVideo() مع وضع video لتشغيل والاستنتاجات. ستعرض Image Classifier API الفئات المحتمَلة. للكائنات داخل صورة الإدخال.

يوضح الرمز البرمجي التالي كيفية تنفيذ المعالجة باستخدام نموذج المهمة:

صورة

const image = document.getElementById("image") as HTMLImageElement;
const imageClassifierResult = imageClassifier.classify(image);

فيديو

const video = document.getElementById("video");
await imageClassifier.setOptions({ runningMode: "VIDEO" });

const timestamp = performance.now();
const classificationResult = await imageClassifier.classifyForVideo(
    video,
    timestamp
  );

لتنفيذ مهمة "مصنِّف الصور" بشكل كامل، يُرجى الاطّلاع على مثال الرمز البرمجي).

التعامل مع العملاء وعرض النتائج

عند تنفيذ الاستنتاج، تعرض مهمة مصنف الصور عنصر ImageClassifierResult الذي يحتوي على قائمة الفئات المحتملة للكائنات داخل الصورة أو الإطار المُدخل.

في ما يلي مثال على بيانات الإخراج من هذه المهمة:

ImageClassifierResult:
 Classifications #0 (single classification head):
  head index: 0
  category #0:
   category name: "/m/01bwb9"
   display name: "Passer domesticus"
   score: 0.91406
   index: 671
  category #1:
   category name: "/m/01bwbt"
   display name: "Passer montanus"
   score: 0.00391
   index: 670

تم الحصول على هذه النتيجة من خلال تنفيذ مصنِّف الطيور. عَلَى:

يوضّح رمز نموذج أداة تصنيف الصور طريقة عرض التصنيف التي تم إرجاعها من المهمة، يمكنك الاطلاع على مثال على الرمز البرمجي لمزيد من التفاصيل.