Nhiệm vụ Tạo kiểu khuôn mặt MediaPipe cho phép bạn áp dụng kiểu khuôn mặt cho các khuôn mặt trong một hình ảnh. Bạn có thể dùng nhiệm vụ này để tạo hình đại diện ảo theo nhiều phong cách.
Mã mẫu được mô tả trong các hướng dẫn này có trên GitHub. Để biết thêm thông tin về tính năng, kiểu máy và các lựa chọn cấu hình của nhiệm vụ này, xem phần Tổng quan.
Ví dụ về mã
Mã ví dụ cho Công cụ tạo kiểu khuôn mặt cung cấp cách triển khai hoàn chỉnh công cụ này trong JavaScript để bạn tham khảo. Mã này giúp bạn kiểm thử tác vụ này và bắt đầu xây dựng ứng dụng tạo kiểu khuôn mặt của riêng bạn. Bạn có thể xem, chạy và chỉnh sửa ví dụ về Công cụ cách điệu khuôn mặt chỉ bằng cách sử dụng trang web của bạn trình duyệt.
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 dành riêng cho việc sử dụng Công cụ cách điệu khuôn mặt. Để biết thông tin chung về cách thiết lập môi trường phát triển web và JavaScript, bao gồm cả 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ã cách điệu khuôn mặt được cung cấp thông qua MediaPipe @mediapipe/tasks-vision
Gói Trạng thái đã hiển thị Bạn có thể tìm và
tải các thư viện này xuống bằng cách làm theo hướng dẫn trong nền tảng Thiết lập
hướng dẫn.
Bạn có thể cài đặt các gói bắt buộc thông qua Gradle bằng cách dùng lệnh sau:
npm install @mediapipe/tasks-vision
Nếu bạn muốn nhập mã tác vụ bằng mạng phân phối nội dung (CDN) hãy thêm mã sau vào <head> trong tệp HTML:
<!-- You can replace JSDeliver with another CDN if you prefer -->
<head>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
crossorigin="anonymous"></script>
</head>
Mẫu
Nhiệm vụ Tạo kiểu khuôn mặt MediaPipe cần có một mô hình đã qua đào tạo tương thích với công việc. Để biết thêm thông tin về các mẫu đã qua đào tạo dành cho công cụ Tạo kiểu khuôn mặt, hãy xem tổng quan về nhiệm vụ phần Mô hình.
Chọn và tải mô hình xuống rồi 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 chức năng createFrom...() của Công cụ cách điệu khuôn mặt để chuẩn bị nhiệm vụ cho
chạy suy luận. Sử dụng hàm createFromModelPath() với một thuộc tính tương đối hoặc
đường dẫn tuyệt đối đến tệp mô hình đã huấn luyện. Nếu mô hình của bạn đã đượ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ạ việc sử dụng hàm createFromOptions() để
thiết lập việc cần làm. Hàm createFromOptions cho phép bạn tuỳ chỉnh
Công cụ cách điệu khuôn mặt với các lựa chọn cấu hình.
Mã sau đây minh hoạ cách tạo và định cấu hình tác vụ bằng công cụ tuỳ chỉnh tùy chọn:
const vision = await FilesetResolver.forVisionTasks(
// path/to/wasm/root
"https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
);
const facestylizer = await FaceStylizer.createFromOptions(
vision,
{
baseOptions: {
modelAssetPath: "https://storage.googleapis.com/mediapipe-models/face_stylizer/blaze_face_stylizer/float32/latest/face_stylizer_color_sketch.task"
},
});
Chuẩn bị dữ liệu
Công cụ tạo kiểu khuôn mặt có thể cách điệu khuôn mặt trong hình ảnh ở bất kỳ định dạng nào mà người tổ chức hỗ trợ trình duyệt. Nhiệm vụ này cũng xử lý tiền xử lý dữ liệu đầu vào, bao gồm thay đổi kích thước, xoay vòng và chuẩn hoá giá trị.
Chạy tác vụ
Công cụ tạo kiểu khuôn mặt sử dụng phương thức stylize() để kích hoạt thông tin suy luận. Việc cần làm
xử lý dữ liệu, cố gắng tạo kiểu khuôn mặt, rồi báo cáo kết quả.
Các lệnh gọi đến phương thức stylize() của Công cụ tạo kiểu khuôn mặt chạy đồng bộ và chặn
luồng giao diện người dùng.
Mã sau đây minh hoạ cách thực thi quá trình xử lý bằng mô hình tác vụ:
const image = document.getElementById("image") as HTMLImageElement;
const faceStylizerResult = faceStylizer.stylize(image);
Xử lý và hiện kết quả
Tính năng cách điệu khuôn mặt trả về một đối tượng MPImage có kiểu cách
khuôn mặt nổi bật trong hình ảnh đầu vào.
Sau đây là ví dụ về dữ liệu đầu ra của tác vụ này:
Bạn có thể tạo kết quả ở trên bằng cách áp dụng Bảng màu vào hình ảnh đầu vào sau:
