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

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

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

קוד לדוגמה

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

הגדרה

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

חבילות JavaScript

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

כדי להתקין את החבילות הנדרשות להעברה מקומית לבמה, משתמשים בפקודה הבאה:

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.mjs"
    crossorigin="anonymous"></script>
</head>

דגם

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

בוחרים מודל, מורידים אותו ושומרים אותו בספריית הפרויקט:

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

יצירת המשימה

משתמשים באחת מהפונקציות של Image Classifier 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: המצב לקלט של תמונה אחת.

‫VIDEO: המצב של פריים מפוענח של סרטון או של שידור חי של נתוני קלט, כמו ממצלמה.		 {IMAGE, VIDEO} IMAGE
displayNamesLocale ההגדרה הזו קובעת את שפת התוויות שבהן יש להשתמש בשמות המוצגים שמופיעים במטא-נתונים של המודל של המשימה, אם הם זמינים. ברירת המחדל היא en לאנגלית. אפשר להוסיף תוויות מתורגמות למטא-נתונים של מודל מותאם אישית באמצעות TensorFlow Lite Metadata Writer API קוד לוקאל en
maxResults מגדיר את המספר המקסימלי האופציונלי של תוצאות סיווג עם הניקוד הכי גבוה שיוחזרו. אם הערך הוא < 0, כל התוצאות הזמינות יוחזרו. מספרים חיוביים -1
scoreThreshold הגדרת סף לניקוד החיזוי שמבטל את הסף שצוין במטא-נתונים של המודל (אם צוין כזה). תוצאות מתחת לערך הזה נדחות. כל מספר ממשי לא מוגדר
categoryAllowlist מגדירים את הרשימה האופציונלית של שמות קטגוריות מותרים. אם המערך לא ריק, תוצאות הסיווג ששם הקטגוריה שלהן לא מופיע במערך הזה יסוננו. המערכת מתעלמת משמות קטגוריות כפולים או לא מוכרים. האפשרות הזו לא יכולה לפעול יחד עם categoryDenylist, ושימוש בשתי האפשרויות יחד יגרום לשגיאה. כל המחרוזות לא מוגדר
categoryDenylist מגדירה את הרשימה האופציונלית של שמות קטגוריות שאסורות. אם המערך לא ריק, תוצאות הסיווג ששם הקטגוריה שלהן נמצא במערך הזה יסוננו. המערכת מתעלמת משמות קטגוריות כפולים או לא מוכרים. האפשרות הזו לא יכולה לפעול יחד עם categoryAllowlist, ושימוש בשתי האפשרויות יחד יוביל לשגיאה. כל המחרוזות לא מוגדר
resultListener מגדיר את מאזין התוצאות לקבל את תוצאות הסיווג באופן אסינכרוני כשמסווג התמונות נמצא במצב שידור חי. אפשר להשתמש בהגדרה הזו רק אם מצב ההפעלה מוגדר ל-LIVE_STREAM לא רלוונטי לא מוגדר

הכנת הנתונים

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

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

הרצת המשימה

המסווג של התמונות משתמש בשיטה classify() עם מצב תמונה ובשיטה classifyForVideo() עם מצב video כדי להפעיל מסקנות. ה-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
  );

לדוגמה מלאה יותר להרצת משימה של סיווג תמונות, אפשר לעיין בדוגמה.

טיפול בתוצאות והצגתן

כשמריצים הסקה, המשימה Image Classifier מחזירה אובייקט 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

התוצאה הזו התקבלה מהרצת סיווג ציפורים על:

תקריב של דרור הבית

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