L'attività Stilizzazione del volto di MediaPipe consente di applicare stilizzazioni dei volti ai volti in un'immagine. Puoi utilizzare questa attività per creare avatar virtuali in vari stili.
L'esempio di codice descritto in queste istruzioni è disponibile su GitHub. Per ulteriori informazioni su funzionalità, modelli e opzioni di configurazione di questa attività, consulta la Panoramica.
Esempio di codice
Il codice di esempio per Face Stylizer fornisce un'implementazione completa in JavaScript come riferimento. Questo codice è utile per testare l'attività Inizia a creare la tua app per la stilizzazione del volto. Puoi visualizzare, eseguire Modifica l'esempio dello Stilizzatore del volto codice usando solo il tuo codice web del browser.
Configurazione
Questa sezione descrive i passaggi chiave per configurare l'ambiente di sviluppo in particolare per usare lo stilo per il viso. Per informazioni generali sulla configurazione dell'ambiente di sviluppo web e JavaScript, inclusa la versione della piattaforma consulta la Guida alla configurazione per il web.
Pacchetti JavaScript
Il codice dello stilo del volto è disponibile tramite MediaPipe @mediapipe/tasks-vision
Pacchetto NPM. Puoi trovare
scarica queste librerie seguendo le istruzioni nella sezione Configurazione della piattaforma
.
Puoi installare i pacchetti richiesti tramite Gestione dei partner di rete utilizzando il seguente comando:
npm install @mediapipe/tasks-vision
Se vuoi importare il codice dell'attività con una rete CDN (Content Delivery Network) servizio, aggiungi il seguente codice nel tag <head> nel file 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>
Modello
L'attività Stilizzatore del viso di MediaPipe richiede un modello addestrato compatibile con dell'attività. Per ulteriori informazioni sui modelli addestrati disponibili per Face Stylizer, vedi la panoramica delle attività nella sezione Modelli.
Seleziona e scarica un modello, quindi archivialo nella directory del progetto:
<dev-project-root>/app/shared/models/
Crea l'attività
Usa una delle funzioni createFrom...() dello Stilizzatore del volto per preparare l'attività per
delle inferenze in esecuzione. Utilizza la funzione createFromModelPath() con un relativo o
percorso assoluto del file del modello addestrato. Se il modello è già caricato
puoi usare il metodo createFromModelBuffer().
L'esempio di codice seguente mostra l'utilizzo della funzione createFromOptions() per
configurare l'attività. La funzione createFromOptions ti consente di personalizzare
Stilizzazione del volto con opzioni di configurazione.
Il codice seguente mostra come creare e configurare l'attività con opzioni:
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"
},
});
Preparazione dei dati
Lo Stilizzatore dei volti può applicare lo stile ai volti nelle immagini in qualsiasi formato supportato dall'host del browser. L'attività gestisce anche la pre-elaborazione dell'input di dati, tra cui il ridimensionamento, la rotazione e la normalizzazione dei valori.
Esegui l'attività
Lo Stilizzatore del viso utilizza il metodo stylize() per attivare le inferenze. L'attività
elabora i dati, tenta di applicare lo stile ai volti e riporta i risultati.
Le chiamate al metodo stylize() dello Stilizzatore dei volti vengono eseguite in modo sincrono e bloccano il
il thread dell'interfaccia utente.
Il seguente codice mostra come eseguire l'elaborazione con il modello di attività:
const image = document.getElementById("image") as HTMLImageElement;
const faceStylizerResult = faceStylizer.stylize(image);
Gestire e visualizzare i risultati
Lo Stilizzatore del volto restituisce un oggetto MPImage con una stilizzazione delle
volto in evidenza nell'immagine di input.
Di seguito è riportato un esempio dei dati di output di questa attività:
L'output precedente è stato creato applicando lo schizzo a colori modello alla seguente immagine di input:
