מדריך לזיהוי אובייקטים באינטרנט

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

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

הגדרה

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

חבילות JavaScript

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

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

npm install @mediapipe/tasks-vision

אם רוצים לייבא את קוד המשימה דרך שירות של רשת להעברת תוכן (CDN), מוסיפים את הקוד הבא לתג <head> בקובץ ה-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 Object Detector, צריך מודל מאומן שתואם למשימה הזו. מידע נוסף על מודלים מאומנים שזמינים לזיהוי אובייקטים מופיע בסקירת המשימות בקטע 'מודלים'.

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

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

יצירת המשימה

משתמשים באחת מהפונקציות של Object Detector ObjectDetector.createFrom...() כדי להכין את המשימה להפעלת מסקנות. משתמשים בפונקציה createFromModelPath() עם נתיב יחסי או מוחלט לקובץ המודל שעבר אימון. אם המודל כבר נטען לזיכרון, אפשר להשתמש בשיטה createFromModelBuffer(). בדוגמת הקוד הבאה מוצג שימוש בפונקציה createFromOptions(), שמאפשרת להגדיר אפשרויות נוספות. מידע נוסף על אפשרויות ההגדרה הזמינות מופיע בקטע אפשרויות הגדרה.

בדוגמת הקוד הבאה אפשר לראות איך יוצרים ומגדירים את המשימה הזו:

const vision = await FilesetResolver.forVisionTasks(
  // path/to/wasm/root
  "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
);
objectDetector = await ObjectDetector.createFromOptions(vision, {
  baseOptions: {
    modelAssetPath: `https://storage.googleapis.com/mediapipe-tasks/object_detector/efficientdet_lite0_uint8.tflite`
  },
  scoreThreshold: 0.5,
  runningMode: runningMode
});

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

אפשרויות הגדרה

למשימה הזו יש את אפשרויות ההגדרה הבאות לאפליקציות אינטרנט:

שם האפשרות תיאור טווח ערכים ערך ברירת מחדל
runningMode הגדרת מצב ההפעלה של המשימה. יש שני מצבים:

IMAGE: המצב לקלט של תמונה אחת.

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

הכנת הנתונים

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

הרצת המשימה

הכלי לזיהוי אובייקטים משתמש ב-detect() כדי לעבוד על תמונות בודדות וב-detectForVideo() כדי לזהות אובייקטים בפריים של סרטונים. הפעולה מעבדת את הנתונים, מנסה לזהות אובייקטים ואז מדווחת על התוצאות.

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

בדוגמה הבאה אפשר לראות איך להריץ את העיבוד באמצעות מודל המשימות:

תמונה

const image = document.getElementById("image") as HTMLImageElement;
const detections = objectDetector.detect(image);

וידאו

await objectDetector.setOptions({ runningMode: "video" });

let lastVideoTime = -1;
function renderLoop(): void {
  const video = document.getElementById("video");

  if (video.currentTime !== lastVideoTime) {
    const detections = detector.detectForVideo(video);
    processResults(detections);
    lastVideoTime = video.currentTime;
  }

  requestAnimationFrame(() => {
    renderLoop();
  });
}

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

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

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

בדוגמה הבאה מוצגים נתוני הפלט של המשימה הזו:

ObjectDetectorResult:
 Detection #0:
  Box: (x: 355, y: 133, w: 190, h: 206)
  Categories:
   index       : 17
   score       : 0.73828
   class name  : dog
 Detection #1:
  Box: (x: 103, y: 15, w: 138, h: 369)
  Categories:
   index       : 17
   score       : 0.73047
   class name  : dog

בתמונה הבאה אפשר לראות הדמיה של פלט המשימה:

שני כלבים שמודגשים באמצעות תיבות תוחמות

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