Giới thiệu Google AI Edge Portal: Đo điểm chuẩn AI trên thiết bị Edge trên quy mô lớn. Đăng ký để yêu cầu quyền truy cập trong bản xem trước riêng tư.

Hướng dẫn phân loại hình ảnh cho Web

Nhiệm vụ Phân loại hình ảnh của MediaPipe cho phép bạn thực hiện việc phân loại trên hình ảnh. Bạn có thể sử dụng nhiệm vụ này để xác định hình ảnh đại diện cho những gì trong một tập hợp danh mục được xác định tại thời điểm huấn luyện. Các hướng dẫn này cho bạn biết cách sử dụng Trình phân loại hình ảnh cho Node và ứng dụng web.

Bạn có thể xem nhiệm vụ này hoạt động bằng cách xem bản minh hoạ. Để biết thêm thông tin về các tính năng, mô hình và lựa chọn cấu hình của nhiệm vụ này, hãy xem phần Tổng quan.

Ví dụ về mã

Mã ví dụ cho Trình phân loại hình ảnh cung cấp một cách triển khai hoàn chỉnh nhiệm vụ này bằng JavaScript để bạn tham khảo. Mã này giúp bạn kiểm thử nhiệm vụ này và bắt đầu xây dựng ứng dụng phân loại hình ảnh của riêng mình. Bạn có thể xem, chạy và chỉnh sửa ví dụ về Trình phân loại hình ảnh chỉ bằng trình duyệt web.

Thiết lập

Phần này mô tả các bước chính để thiết lập môi trường phát triển và dự án mã dành riêng cho việc sử dụng Trình phân loại hình ảnh. Để biết thông tin chung về cách thiết lập môi trường phát triển để sử dụng các nhiệm vụ của MediaPipe, bao gồm các yêu cầu về phiên bản nền tảng, hãy xem hướng dẫn Thiết lập cho web.

Gói JavaScript

Mã Trình phân loại hình ảnh có sẵn thông qua gói @mediapipe/tasks-vision NPM của MediaPipe. Bạn có thể tìm và tải các thư viện này xuống từ các đường liên kết được cung cấp trong hướng dẫn Thiết lập nền tảng.

Bạn có thể cài đặt các gói bắt buộc bằng mã sau đây để dàn dựng cục bộ bằng lệnh sau:

npm install @mediapipe/tasks-vision

Nếu bạn muốn nhập mã nhiệm vụ thông qua dịch vụ mạng phân phối nội dung (CDN) , hãy thêm mã sau vào thẻ trong tệp 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>

Mô hình

Nhiệm vụ Trình phân loại hình ảnh của MediaPipe yêu cầu một mô hình đã huấn luyện tương thích với nhiệm vụ này. Để biết thêm thông tin về các mô hình đã huấn luyện có sẵn cho Trình phân loại hình ảnh, hãy xem phần tổng quan về nhiệm vụ phần Mô hình.

Chọn và tải một mô hình xuống, sau đó lưu trữ mô hình đó trong thư mục dự án:

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

Tạo việc cần làm

Sử dụng một trong các hàm createFrom...() của Trình phân loại hình ảnh để chuẩn bị nhiệm vụ chạy suy luận. Sử dụng hàm createFromModelPath() với đường dẫn tương đối hoặc tuyệt đối đến tệp mô hình đã huấn luyện. Nếu mô hình đã được tải vào bộ nhớ, bạn có thể sử dụng phương thức createFromModelBuffer().

Ví dụ về mã bên dưới minh hoạ cách sử dụng hàm createFromOptions() để thiết lập nhiệm vụ. Hàm createFromOptions cho phép bạn tuỳ chỉnh Trình phân loại hình ảnh bằng các lựa chọn cấu hình. Để biết thêm thông tin về các lựa chọn cấu hình, hãy xem phần Các lựa chọn về cấu hình.

Đoạn mã sau đây minh hoạ cách xây dựng và định cấu hình nhiệm vụ bằng các lựa chọn tuỳ chỉnh:

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`
    },
  });
}

Các lựa chọn về cấu hình

Nhiệm vụ này có các lựa chọn cấu hình sau đây cho ứng dụng web:

Tên lựa chọn	Mô tả	Phạm vi giá trị	Giá trị mặc định
`runningMode`	Đặt chế độ chạy cho nhiệm vụ. Có 2 chế độ: IMAGE: Chế độ cho dữ liệu đầu vào là một hình ảnh. VIDEO: Chế độ cho các khung hình đã giải mã của video hoặc trên sự kiện phát trực tiếp dữ liệu đầu vào, chẳng hạn như từ máy ảnh.	{`IMAGE, VIDEO`}	`IMAGE`
`displayNamesLocale`	Đặt ngôn ngữ của nhãn để sử dụng cho tên hiển thị được cung cấp trong siêu dữ liệu của mô hình nhiệm vụ (nếu có). Mặc định là `en` cho tiếng Anh. Bạn có thể thêm nhãn đã bản địa hoá vào siêu dữ liệu của mô hình tuỳ chỉnh bằng API Trình ghi siêu dữ liệu TensorFlow Lite	Mã ngôn ngữ	vi
`maxResults`	Đặt số lượng tối đa không bắt buộc của kết quả phân loại được tính điểm cao nhất để trả về. Nếu < 0, tất cả kết quả có sẵn sẽ được trả về.	Bất kỳ số dương nào	`-1`
`scoreThreshold`	Đặt ngưỡng điểm dự đoán ghi đè ngưỡng được cung cấp trong siêu dữ liệu mô hình (nếu có). Kết quả dưới giá trị này sẽ bị từ chối.	Bất kỳ số thực nào	Chưa đặt
`categoryAllowlist`	Đặt danh sách không bắt buộc gồm các tên danh mục được cho phép. Nếu không trống, kết quả phân loại có tên danh mục không nằm trong tập hợp này sẽ bị lọc. Tên danh mục trùng lặp hoặc không xác định sẽ bị bỏ qua. Lựa chọn này loại trừ lẫn nhau với `categoryDenylist` và việc sử dụng cả hai sẽ dẫn đến lỗi.	Bất kỳ chuỗi nào	Chưa đặt
`categoryDenylist`	Đặt danh sách không bắt buộc gồm các tên danh mục không được phép. Nếu không trống, kết quả phân loại có tên danh mục nằm trong tập hợp này sẽ bị lọc. Tên danh mục trùng lặp hoặc không xác định sẽ bị bỏ qua. Lựa chọn này loại trừ lẫn nhau với `categoryAllowlist` và việc sử dụng cả hai sẽ dẫn đến lỗi.	Bất kỳ chuỗi nào	Chưa đặt
`resultListener`	Đặt trình nghe kết quả để nhận kết quả phân loại không đồng bộ khi Trình phân loại hình ảnh ở chế độ phát trực tiếp. Chỉ có thể sử dụng khi chế độ chạy được đặt thành `LIVE_STREAM`	Không áp dụng	Chưa đặt

Chuẩn bị dữ liệu

Trình phân loại hình ảnh có thể phân loại các đối tượng trong hình ảnh ở mọi định dạng được trình duyệt lưu trữ hỗ trợ. Nhiệm vụ này cũng xử lý quá trình tiền xử lý dữ liệu đầu vào, bao gồm cả việc đổi kích thước, xoay và chuẩn hoá giá trị.

Các lệnh gọi đến phương thức classify() và classifyForVideo() của Trình phân loại hình ảnh chạy đồng bộ và chặn luồng giao diện người dùng. Nếu bạn phân loại các đối tượng trong khung hình video từ máy ảnh của thiết bị, thì mỗi lần phân loại sẽ chặn luồng chính. Bạn có thể ngăn điều này bằng cách triển khai trình thực thi web để chạy classify() và classifyForVideo() trên một luồng khác.

Chạy tác vụ

Trình phân loại hình ảnh sử dụng phương thức classify() với chế độ hình ảnh và phương thức classifyForVideo() với chế độ video để kích hoạt suy luận. API Trình phân loại hình ảnh sẽ trả về các danh mục có thể có cho các đối tượng trong hình ảnh đầu vào.

Đoạn mã sau đây minh hoạ cách thực thi quy trình xử lý bằng mô hình tác vụ:

Hình ảnh

const image = document.getElementById("image") as HTMLImageElement;
const imageClassifierResult = imageClassifier.classify(image);

Video

const video = document.getElementById("video");
await imageClassifier.setOptions({ runningMode: "VIDEO" });

const timestamp = performance.now();
const classificationResult = await imageClassifier.classifyForVideo(
    video,
    timestamp
  );

Để biết cách triển khai đầy đủ hơn về việc chạy nhiệm vụ Trình phân loại hình ảnh, hãy xem ví dụ.

Xử lý và hiển thị kết quả

Sau khi chạy suy luận, tác vụ Trình phân loại hình ảnh sẽ trả về một đối tượng ImageClassifierResult chứa danh sách các danh mục có thể có cho các đối tượng trong hình ảnh hoặc khung hình đầu vào.

Sau đây là ví dụ về dữ liệu đầu ra từ nhiệm vụ này:

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

Kết quả này được thu thập bằng cách chạy Trình phân loại chim trên:

Ảnh chụp cận cảnh một con sẻ nhà

Mã ví dụ về Trình phân loại hình ảnh minh hoạ cách hiển thị kết quả phân loại được trả về từ nhiệm vụ, hãy xem ví dụ để biết thông tin chi tiết.