מדריך לסיווג תמונות באינטרנט

המשימה 'מסווג תמונות של MediaPipe' מאפשרת לכם לבצע סיווג של תמונות. אפשר להשתמש במשימה הזו כדי לזהות מה תמונה מייצגת מתוך קבוצת קטגוריות שהוגדרה בזמן האימון. ההוראות הבאות מראות איך להשתמש במסווג התמונות באפליקציות אינטרנט ובאפליקציות צומת.

אפשר לראות את המשימה הזו בהדגמה. בסקירה הכללית תוכלו לקרוא מידע נוסף על היכולות, המודלים ואפשרויות ההגדרה של המשימה הזו.

קוד לדוגמה

הקוד לדוגמה של מסווג התמונות מספק הטמעה מלאה של המשימה הזו ב-JavaScript לעיונכם. הקוד הזה יעזור לכם לבדוק את המשימה הזו ולהתחיל לפתח אפליקציה משלכם לסיווג תמונות. תוכלו להציג, להריץ ולערוך את קוד הדוגמה של מסווג התמונות באמצעות דפדפן האינטרנט בלבד.

הגדרה

בקטע הזה מתוארים השלבים העיקריים להגדרת סביבת הפיתוח ופרויקטים בקוד במיוחד לשימוש במסווג התמונות. במדריך ההגדרה לאינטרנט תוכלו לקרוא מידע כללי על הגדרת סביבת הפיתוח לשימוש במשימות של MediaPipe, כולל הדרישות לגרסת הפלטפורמה.

חבילות JavaScript

הקוד של מסווג התמונות זמין דרך חבילת ה-@mediapipe/tasks-vision NPM של MediaPipe. אפשר למצוא את הספריות האלה ולהוריד אותן בקישורים שבמדריך ההגדרה בפלטפורמה.

אפשר להתקין את החבילות הנדרשות עם הקוד הבא לצורך Staging מקומי באמצעות הפקודה הבאה:

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`	מגדירה את סף הציון של החיזוי (אם יש כזה) שמבטל את הסף שצוין במטא-נתונים של המודל. תוצאות מתחת לערך הזה נדחות.	כל מספר ממשי (float)	לא הוגדר
`categoryAllowlist`	מגדיר את הרשימה האופציונלית של שמות קטגוריות מותרות. אם השדה לא ריק, תוצאות הסיווג שבהן שם הקטגוריה לא נמצא בקבוצה הזו יסוננו. המערכת מתעלמת משמות קטגוריות כפולים או לא ידועים. האפשרות הזו קיימת רק ב-`categoryDenylist` ומשתמשת בשתיהן כדי ליצור שגיאה.	כל מחרוזת	לא הוגדר
`categoryDenylist`	מגדיר את הרשימה האופציונלית של שמות קטגוריות שאינם מותרים. אם השדה לא ריק, תוצאות הסיווג שבהן שם הקטגוריה נמצא בקבוצה הזו יסוננו. המערכת מתעלמת משמות קטגוריות כפולים או לא ידועים. האפשרות הזו בלעדית באופן הדדי ל-`categoryAllowlist`, והשימוש בשתי האפשרויות יוביל לשגיאה.	כל מחרוזת	לא הוגדר
`resultListener`	מגדיר את אוזן התוצאות לקבל את תוצאות הסיווג באופן אסינכרוני כאשר מסווג התמונות נמצא במצב של שידור חי. אפשר להשתמש באפשרות הזו רק כשמצב הריצה מוגדר ל-`LIVE_STREAM`	לא רלוונטי	לא הוגדר

הכנת נתונים

מסווג התמונות יכול לסווג אובייקטים בתמונות בכל פורמט שנתמך על ידי הדפדפן המארח. המשימה מטפלת גם בעיבוד מראש של קלט הנתונים, כולל שינוי הגודל, רוטציה ונירמול ערכים.

קריאות ל-methods classify() ו-classifyForVideo() של מסווג התמונות פועלות באופן סינכרוני וחוסמות את ה-thread של ממשק המשתמש. אם מסווגים אובייקטים בפריימים של וידאו מהמצלמה של המכשיר, כל סיווג יחסום את ה-thread הראשי. כדי למנוע זאת, תוכלו להטמיע עובדי אינטרנט כדי להריץ את classify() ואת classifyForVideo() בשרשור אחר.

הרצת המשימה

מסווג התמונות משתמש ב-method classify() במצב תמונה וב-method 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

התוצאה הזו התקבלה על ידי הפעלת Bird Classifier על:

הקוד לדוגמה של מסווג התמונות שמדגים איך להציג את תוצאות הסיווג שהוחזרו מהמשימה מופיע בקוד לדוגמה.