راهنمای طبقه بندی تصاویر برای وب

وظیفه طبقه‌بندی تصویر MediaPipe به شما امکان می‌دهد طبقه‌بندی را روی تصاویر انجام دهید. می‌توانید از این وظیفه برای شناسایی آنچه یک تصویر در بین مجموعه‌ای از دسته‌های تعریف شده در زمان آموزش نشان می‌دهد، استفاده کنید. این دستورالعمل‌ها نحوه استفاده از طبقه‌بندی تصویر را برای برنامه‌های Node و وب به شما نشان می‌دهند.

شما می‌توانید با مشاهده‌ی دمو، این وظیفه را در عمل مشاهده کنید. برای اطلاعات بیشتر در مورد قابلیت‌ها، مدل‌ها و گزینه‌های پیکربندی این وظیفه، به نمای کلی مراجعه کنید.

مثال کد

کد نمونه برای طبقه‌بندی تصویر، پیاده‌سازی کاملی از این کار را در جاوا اسکریپت برای مرجع شما ارائه می‌دهد. این کد به شما کمک می‌کند تا این کار را آزمایش کنید و ساخت برنامه طبقه‌بندی تصویر خود را شروع کنید. می‌توانید مثال طبقه‌بندی تصویر را فقط با استفاده از مرورگر وب خود مشاهده، اجرا و ویرایش کنید.

راه‌اندازی

این بخش مراحل کلیدی برای تنظیم محیط توسعه و پروژه‌های کدنویسی شما را به طور خاص برای استفاده از طبقه‌بندی‌کننده تصویر شرح می‌دهد. برای اطلاعات کلی در مورد تنظیم محیط توسعه برای استفاده از وظایف MediaPipe، از جمله الزامات نسخه پلتفرم، به راهنمای تنظیم برای وب مراجعه کنید.

بسته‌های جاوا اسکریپت

کد طبقه‌بندی تصویر از طریق بسته NPM مدیاپایپ @mediapipe/tasks-vision در دسترس است. می‌توانید این کتابخانه‌ها را از لینک‌های ارائه شده در راهنمای راه‌اندازی پلتفرم پیدا کرده و دانلود کنید.

شما می‌توانید بسته‌های مورد نیاز را با کد زیر برای مرحله‌بندی محلی با استفاده از دستور زیر نصب کنید:

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 به یک مدل آموزش‌دیده نیاز دارد که با این وظیفه سازگار باشد. برای اطلاعات بیشتر در مورد مدل‌های آموزش‌دیده‌ی موجود برای طبقه‌بندی تصویر، به بخش مدل‌های نمای کلی وظیفه مراجعه کنید.

یک مدل را انتخاب و دانلود کنید و سپس آن را در دایرکتوری پروژه خود ذخیره کنید:

<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, VIDEO` }	`IMAGE`
`displayNamesLocale`	زبان برچسب‌ها را برای نمایش نام‌های ارائه شده در فراداده مدل وظیفه، در صورت وجود، تنظیم می‌کند. پیش‌فرض `en` برای انگلیسی است. می‌توانید با استفاده از API نویسنده فراداده TensorFlow Lite، برچسب‌های محلی را به فراداده یک مدل سفارشی اضافه کنید.	کد محلی	انگلیسی
`maxResults`	حداکثر تعداد نتایج طبقه‌بندی با بالاترین امتیاز را که باید برگردانده شوند، تنظیم می‌کند. اگر < 0 باشد، تمام نتایج موجود برگردانده می‌شوند.	هر عدد مثبت	`-1`
`scoreThreshold`	آستانه امتیاز پیش‌بینی را تنظیم می‌کند که بر آستانه ارائه شده در فراداده مدل (در صورت وجود) غلبه می‌کند. نتایج زیر این مقدار رد می‌شوند.	هر شناوری	تنظیم نشده
`categoryAllowlist`	لیست اختیاری نام‌های مجاز دسته‌بندی را تنظیم می‌کند. اگر خالی نباشد، نتایج طبقه‌بندی که نام دسته‌بندی آنها در این مجموعه نباشد، فیلتر می‌شوند. نام‌های تکراری یا ناشناخته‌ی دسته‌بندی نادیده گرفته می‌شوند. این گزینه با `categoryDenylist` ناسازگار است و استفاده از هر دو منجر به خطا می‌شود.	هر رشته‌ای	تنظیم نشده
`categoryDenylist`	لیست اختیاری نام‌های دسته‌بندی که مجاز نیستند را تنظیم می‌کند. اگر خالی نباشد، نتایج طبقه‌بندی که نام دسته‌بندی آنها در این مجموعه باشد، فیلتر می‌شوند. نام‌های دسته‌بندی تکراری یا ناشناخته نادیده گرفته می‌شوند. این گزینه با `categoryAllowlist` ناسازگار است و استفاده از هر دو منجر به خطا می‌شود.	هر رشته‌ای	تنظیم نشده
`resultListener`	شنونده نتیجه را طوری تنظیم می‌کند که وقتی طبقه‌بندی‌کننده تصویر در حالت پخش زنده است، نتایج طبقه‌بندی را به صورت غیرهمزمان دریافت کند. فقط زمانی قابل استفاده است که حالت اجرا روی `LIVE_STREAM` تنظیم شده باشد.	ناموجود	تنظیم نشده

آماده‌سازی داده‌ها

طبقه‌بندی‌کننده تصویر می‌تواند اشیاء موجود در تصاویر را با هر فرمتی که توسط مرورگر میزبان پشتیبانی می‌شود، طبقه‌بندی کند. این وظیفه همچنین پیش‌پردازش داده‌های ورودی، از جمله تغییر اندازه، چرخش و نرمال‌سازی مقادیر را انجام می‌دهد.

فراخوانی متدهای classify() classifier Classifier و classifyForVideo() به صورت همزمان اجرا می‌شوند و نخ رابط کاربری را مسدود می‌کنند. اگر اشیاء را در فریم‌های ویدیویی از دوربین یک دستگاه طبقه‌بندی کنید، هر طبقه‌بندی نخ اصلی را مسدود می‌کند. می‌توانید با پیاده‌سازی web workerها برای اجرای 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

این نتیجه با اجرای طبقه‌بندی‌کننده پرندگان روی موارد زیر به دست آمده است:

عکس نزدیک از گنجشک خانگی

کد مثال طبقه‌بندی تصویر، نحوه نمایش نتایج طبقه‌بندی برگردانده شده از وظیفه را نشان می‌دهد، برای جزئیات بیشتر به مثال مراجعه کنید.