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

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

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

نمونه کد

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

برپایی

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

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

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

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

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 به یک مدل آموزش دیده نیاز دارد که با این کار سازگار باشد. برای اطلاعات بیشتر در مورد مدل‌های آموزش‌دیده موجود برای 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` تنظیم شده باشد	N/A	تنظیم نشده

داده ها را آماده کنید

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

فراخوانی به روش های Image Classifier classify() و classifyForVideo() به صورت همزمان اجرا می شود و رشته رابط کاربری را مسدود می کند. اگر اشیاء را در فریم های ویدیویی از دوربین دستگاه طبقه بندی کنید، هر طبقه بندی رشته اصلی را مسدود می کند. می‌توانید با پیاده‌سازی وب‌کارگرها برای اجرای classify() و classifyForVideo() در رشته‌ای دیگر از این امر جلوگیری کنید.

وظیفه را اجرا کنید

Image Classifier از متد classify() با حالت تصویر و از متد 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
  );

برای اجرای کامل‌تر اجرای یک کار طبقه‌بندی کننده تصویر، به مثال کد مراجعه کنید.

کنترل و نمایش نتایج

پس از اجرای استنتاج، وظیفه 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

این نتیجه با اجرای Bird Classifier در موارد زیر به دست آمده است:

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