La tarea Estilizador de rostros de MediaPipe te permite aplicar estilizaciones de rostros a los rostros de una imagen. Puedes usar esta tarea para crear avatares virtuales con varios estilos.
La muestra de código descrita en estas instrucciones está disponible en GitHub: Para obtener más información sobre las capacidades, los modelos y las opciones de configuración para completar esta tarea, consulta la Descripción general.
Ejemplo de código
El código de ejemplo para el estilizador de rostros brinda una implementación completa de esto. en JavaScript para tu referencia. Este código te ayuda a probar la tarea y comienza a compilar tu propia app de estilización de rostros. Puedes ver, ejecutar y Edita el ejemplo del Estilizador de rostros . código de sitios web solo con tu navegador.
Configuración
En esta sección, se describen los pasos clave para configurar tu entorno de desarrollo específicamente para usar el Estilizador de rostros. Para obtener información general sobre cómo configurar tu entorno de desarrollo web y JavaScript, incluida la versión de la plataforma consulta la Guía de configuración para la Web.
Paquetes de JavaScript
El código del Estilizador de rostros está disponible a través de MediaPipe @mediapipe/tasks-vision
.
NPM. Puedes encontrar y
descarga estas bibliotecas siguiendo las instrucciones que se indican en la página Configuración
de la guía de YouTube.
Puedes instalar los paquetes requeridos a través de NPM con el siguiente comando:
npm install @mediapipe/tasks-vision
Si quieres importar el código de la tarea con una red de distribución de contenidos (CDN) agrega el siguiente código en la sección <head> etiqueta en tu archivo 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>
Modelo
La tarea MediaPipe Face Stylizer requiere un modelo entrenado que sea compatible con esta tarea. Para obtener más información sobre los modelos entrenados disponibles para el Estilizador de rostros, consulta la sección Modelos de la descripción general de la tarea.
Selecciona y descarga un modelo y, luego, guárdalo en el directorio de tu proyecto:
<dev-project-root>/app/shared/models/
Crea la tarea
Usa una de las funciones createFrom...()
del Estilizador de rostros para preparar la tarea.
ejecutar inferencias. Usa la función createFromModelPath()
con un valor relativo
absoluta al archivo del modelo entrenado. Si tu modelo ya está cargado en
puedes usar el método createFromModelBuffer()
.
En el siguiente ejemplo de código, se demuestra el uso de la función createFromOptions()
para
configurar la tarea. La función createFromOptions
te permite personalizar la
Estilizador de rostros con opciones de configuración.
En el siguiente código, se muestra cómo compilar y configurar la tarea con Opciones:
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"
},
});
Preparar los datos
El Estilizador de rostros puede estilizar rostros en imágenes en cualquier formato que admita el host. navegador. La tarea también maneja el procesamiento previo de la entrada de datos, lo que incluye el cambio de tamaño, y la normalización de valores.
Ejecuta la tarea
El estilizador de rostros usa el método stylize()
para activar las inferencias. La tarea
procesa los datos, intenta estilizar los rostros y, luego, informa los resultados.
Las llamadas al método stylize()
del Estilizador de rostros se ejecutan de forma síncrona y bloquean las
de la interfaz de usuario.
En el siguiente código, se muestra cómo ejecutar el procesamiento con el modelo de tareas:
const image = document.getElementById("image") as HTMLImageElement;
const faceStylizerResult = faceStylizer.stylize(image);
Cómo controlar y mostrar resultados
El estilizador de rostros muestra un objeto MPImage
con una estilización de lo más
prominente dentro de la imagen de entrada.
A continuación, se muestra un ejemplo de los datos de salida de esta tarea:
El resultado anterior se creó con la aplicación del Boceto de color modelo a la siguiente imagen de entrada: