Mit der Aufgabe „MediaPipe Face Stylizer“ können Sie Gesichter auf die Gesichter in einem Bild stilisieren. Bei dieser Aufgabe können Sie virtuelle Avatare in verschiedenen Stilen erstellen.
Das in dieser Anleitung beschriebene Codebeispiel ist auf GitHub verfügbar. Weitere Informationen zu den Funktionen, Modellen und Konfigurationsoptionen dieser Aufgabe finden Sie in der Übersicht.
Codebeispiel
Der Beispielcode für Face Stylizer bietet eine vollständige JavaScript-Implementierung dieser Aufgabe. Mit diesem Code können Sie diese Aufgabe testen und mit dem Erstellen Ihrer eigenen Anwendung zur Gesichtsstilisierung beginnen. Sie können den Beispielcode für den Face Stylizer einfach über Ihren Webbrowser aufrufen, ausführen und bearbeiten.
Einrichtung
In diesem Abschnitt werden die wichtigsten Schritte zum Einrichten der Entwicklungsumgebung speziell für die Verwendung des Gesichtsstiles beschrieben. Allgemeine Informationen zum Einrichten der Web- und JavaScript-Entwicklungsumgebung, einschließlich der Plattformversionsanforderungen, finden Sie im Einrichtungsleitfaden für das Web.
JavaScript-Pakete
Der Face Stylizer-Code ist im @mediapipe/tasks-vision
NPM-Paket von MediaPipe erhältlich. Folgen Sie der Anleitung im Einrichtungsleitfaden für die Plattform, um diese Bibliotheken zu finden und herunterzuladen.
Mit dem folgenden Befehl können Sie die erforderlichen Pakete über NPM installieren:
npm install @mediapipe/tasks-vision
Wenn Sie den Aufgabencode mit einem Content Delivery Network-Dienst (CDN) importieren möchten, fügen Sie den folgenden Code in das <head>-Tag Ihrer HTML-Datei ein:
<!-- 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>
Modell
Für die MediaPipe Face Stylizer-Aufgabe ist ein trainiertes Modell erforderlich, das mit dieser Aufgabe kompatibel ist. Weitere Informationen zu verfügbaren trainierten Modellen für Face Stylizer finden Sie in der Aufgabenübersicht im Abschnitt „Modelle“.
Wählen Sie ein Modell aus, laden Sie es herunter und speichern Sie es dann in Ihrem Projektverzeichnis:
<dev-project-root>/app/shared/models/
Aufgabe erstellen
Bereiten Sie die Aufgabe zum Ausführen von Inferenzen mit einer der createFrom...()-Funktionen des Face Stylizers vor. Verwenden Sie die Funktion createFromModelPath() mit einem relativen oder absoluten Pfad zur Datei des trainierten Modells. Wenn das Modell bereits in den Arbeitsspeicher geladen ist, können Sie die Methode createFromModelBuffer() verwenden.
Das folgende Codebeispiel zeigt, wie Sie die Aufgabe mit der Funktion createFromOptions() einrichten. Mit der Funktion createFromOptions können Sie den Face Stylizer mit Konfigurationsoptionen anpassen.
Der folgende Code zeigt, wie Sie die Aufgabe mit benutzerdefinierten Optionen erstellen und konfigurieren:
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"
},
});
Daten vorbereiten
Face Stylizer kann Gesichter in Bildern in jedem Format stilisieren, das vom Hostbrowser unterstützt wird. Die Aufgabe übernimmt auch die Vorverarbeitung der Dateneingabe, einschließlich Größenanpassung, Rotation und Wertenormalisierung.
Task ausführen
Der Face Stylizer verwendet die stylize()-Methode, um Inferenzen auszulösen. Die Aufgabe verarbeitet die Daten, versucht, Gesichter zu stilisieren und meldet dann die Ergebnisse.
Aufrufe der Face Stylizer-Methode stylize() werden synchron ausgeführt und blockieren den Thread der Benutzeroberfläche.
Der folgende Code zeigt, wie die Verarbeitung mit dem Aufgabenmodell ausgeführt wird:
const image = document.getElementById("image") as HTMLImageElement;
const faceStylizerResult = faceStylizer.stylize(image);
Ergebnisse verarbeiten und anzeigen
Der Face Stylizer gibt ein MPImage-Objekt mit einer Stilisierung des auffälligsten Gesichts im Eingabebild zurück.
Im Folgenden sehen Sie ein Beispiel für die Ausgabedaten dieser Aufgabe:
Die obige Ausgabe wurde erstellt, indem das Modell Color sketch auf das folgende Eingabebild angewendet wurde:
