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

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

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

קוד לדוגמה

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

הגדרה

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

חבילות JavaScript

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

אפשר להתקין את החבילות הנדרשות באמצעות הקוד הבא ליצירת גרסת build מקומית באמצעות הפקודה הבאה:

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, נדרש מודל מאומן שתואם למשימה הזו. מידע נוסף על המודלים המאומנים הזמינים ל-Image Classifier זמין בקטע 'מודלים' בסקירה הכללית של המשימה.

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

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

יצירת המשימה

משתמשים באחת מהפונקציות createFrom...() של Image Classifier כדי להכין את המשימה להרצת מסקנות. משתמשים בפונקציה createFromModelPath() עם נתיב יחסי או מוחלט לקובץ המודל שעבר אימון. אם המודל כבר נטען בזיכרון, אפשר להשתמש ב-method‏ 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 מגדיר את מאזין התוצאות לקבל את תוצאות הסיווג באופן אסינכרוני כש-Image Classifier נמצא במצב של שידור חי. אפשר להשתמש בה רק כשמצב ההפעלה מוגדר כ-LIVE_STREAM לא רלוונטי לא מוגדר

הכנת הנתונים

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

קריאות לשיטות classify() ו-classifyForVideo() של Image Classifier פועלות באופן סינכרוני וחוסמות את הליץ' של ממשק המשתמש. אם תסיוגו אובייקטים בפריימים של סרטונים ממצלמת המכשיר, כל סיווג יחסום את השרשור הראשי. כדי למנוע זאת, אפשר להטמיע משימות אינטרנט (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
  );

להטמעה מלאה יותר של הפעלת משימה של סיווג תמונות, ראו דוגמת הקוד.

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

לאחר הפעלת ההסקה, המשימה 'סיווג תמונות' מחזירה אובייקט 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:

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

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