MediaPipe Yüz İşaretçisi görevi, fotoğraftaki yüzlerin önemli noktalarını ve yüz ifadelerini algılamanızı sağlar. resimler ve videolar. Bu görevi, insanların yüz ifadelerini tespit etmek, yüz filtreleri ve efektleri uygulayabilir, sanal avatarlar oluşturabilirsiniz. Bu görev tek bir görüntüyle veya sürekli bir görüntüyle çalışabilen makine öğrenimi (ML) görsel akışı anlamına gelir. Görev, 3 boyutlu yüz yer işaretleri, karışım şekli, Yüzle ilgili ayrıntılı bilgileri elde etmek için puanları (yüz ifadesini temsil eden katsayılar) gerçek zamanlı yüzeyler ve dönüşüm matrislerini kullanarak ve efekt oluşturmak için gereken dönüşüm işlemlerini yapabilirsiniz.
Bu talimatlarda, web ve JavaScript için Yüz İşaretçisi'nin nasıl kullanılacağı gösterilmektedir Özellikler, modeller ve yapılandırma hakkında daha fazla bilgi için bu görevin seçenekleri için Genel Bakış'ı inceleyin.
Kod örneği
Yüz İşaretçisi için örnek kod, bu simgenin tam olarak görevi aşağıda bulabilirsiniz. Bu kod, görevi test etmenize ve kendi yüz işaretleyici uygulamanızı geliştirmeye başladınız. Bu dosyaları görüntüleyebilir, çalıştırabilir Yüz İşaretçisi örnek kodunu düzenleyin yalnızca web tarayıcınızı kullanarak.
Kurulum
Bu bölümde, geliştirme ortamınızı kurmaya yönelik temel adımlar açıklanmaktadır. çok daha fazla seçenek içeriyor. Şu konularda genel bilgi için: dahil olmak üzere web ve JavaScript geliştirme ortamınızı daha fazla bilgi için Web için kurulum kılavuzu.
JavaScript paketleri
Yüz İşaretçisi kodu MediaPipe @mediapipe/tasks-vision
üzerinden kullanılabilir
NPM paketi. Şunları yapabilirsiniz:
platformdaki talimatları uygulayarak bu kitaplıkları bulup indirin
Kurulum kılavuzu.
Gerekli paketleri NPM üzerinden yükleyebilirsiniz kullanabilirsiniz:
npm install @mediapipe/tasks-vision
Görev kodunu içerik yayınlama ağı (CDN) aracılığıyla içe aktarmak istiyorsanız aşağıdaki kodu <head> bölümüne ekleyin ve etiketini ekleyin:
<!-- You can replace JSDeliver with another CDN if you prefer to -->
<head>
<script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
crossorigin="anonymous"></script>
</head>
Model
MediaPipe Yüz İşaretçisi görevi, bu görevi görebilir. Yüz İşaretçisi'nin eğitildiği modeller hakkında daha fazla bilgi almak için bkz. göreve genel bakış Modeller bölümü.
Bir model seçip indirin ve ardından bu modeli proje dizininizde depolayın:
<dev-project-root>/app/shared/models/
Görevi oluşturma
Yüz İşaretçisi createFrom...()
işlevlerinden birini kullanarak
çıkarımları yapmaya hazır hale getirebilirsiniz. createFromModelPath()
kullanın
işlevi, eğitilen model dosyasına giden göreli veya mutlak bir yolla
Modeliniz belleğe zaten yüklenmişse aşağıdakileri kullanabilirsiniz:
createFromModelBuffer()
yöntemini çağırın.
Aşağıdaki kod örneğinde, createFromOptions()
işlevinin
görevi ayarlayın. createFromOptions
işlevi,
Yapılandırma seçeneklerine sahip Yüz İşaretçisi. Daha fazla bilgi için bkz.
Yapılandırma seçenekleri.
Aşağıdaki kod, görevin özel seçenekler:
const vision = await FilesetResolver.forVisionTasks(
// path/to/wasm/root
"https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
);
const faceLandmarker = await faceLandmarker.createFromOptions(
vision,
{
baseOptions: {
modelAssetPath: "path/to/model"
},
runningMode: runningMode
});
Yapılandırma seçenekleri
Bu görev, Web ve JavaScript için aşağıdaki yapılandırma seçeneklerine sahiptir uygulamalar:
Seçenek Adı | Açıklama | Değer Aralığı | Varsayılan Değer |
---|---|---|---|
running_mode |
Görev için çalışma modunu ayarlar. İki tür
modlar: . IMAGE: Tek resimli giriş modu. . . VIDEO: Bir karedeki kodu çözülmüş karelere ilişkin mod kameradan alınan video veya giriş verileri gibi bir yayın paylaşabilir. |
{IMAGE, VIDEO } |
IMAGE |
numFaces |
tarafından algılanabilecek maksimum yüz sayısı
FaceLandmarker . Düzleştirme yalnızca
num_faces 1 olarak ayarlandı.
|
Integer > 0 |
1 |
minFaceDetectionConfidence |
Yüz tanıma için gereken minimum güven puanı kabul edilir. | Float [0.0,1.0] |
0.5 |
minFacePresenceConfidence |
Yüz tanımanın minimum güven puanı puanı. | Float [0.0,1.0] |
0.5 |
minTrackingConfidence |
Yüz izleme için minimum güven puanı kabul edilir. | Float [0.0,1.0] |
0.5 |
outputFaceBlendshapes |
Yüz İşaretçisi'nin yüz karışım şekillerini sağlayıp sağlamadığı. 3D yüz modelinin oluşturulması için yüz karışım şekilleri kullanılır. | Boolean |
False |
outputFacialTransformationMatrixes |
FaceLandmarker'ın yüz verilerini sağlayıp sağlamadığı ve dönüşüm matrisini gözden geçireceğiz. FaceLandmarker, yüzdeki yer işaretlerini standart bir yüz modelinden yüz modeli görünümüne dönüştürmek için Böylece, kullanıcılar algılanan önemli noktalara efekt uygulayabilir. | Boolean |
False |
Verileri hazırlama
Yüz İşaretçisi, aracı tarafından desteklenen herhangi bir biçimdeki resimlerdeki yüzleri algılayabilir. ana tarayıcı tarayıcısı. Görev ayrıca aşağıdakiler de dahil olmak üzere veri girişi ön işlemesini: yeniden boyutlandırma, döndürme ve değer normalleştirmesi gibi. Videolardaki yüzleri belirgin şekilde belirtmek için: zaman damgasını kullanarak her seferinde bir kareyi hızlı bir şekilde işlemek için API'yi karenin arka plan rengini arka arkaya alarak görüntülerin yerini belirler.
Görevi çalıştırma
Yüz İşaretçisi, detect()
(koşu modu IMAGE
ile) ve
Tetiklenecek detectForVideo()
(çalışma modu VIDEO
ile) yöntemi
çıkarımlar. Görev verileri işler, yüzleri simge haline getirmeye çalışır
ve sonuçları bildirir.
Yüz İşaretçisi detect()
ve detectForVideo()
yöntemlerine yapılan çağrılar çalıştırılır
senkronize edin ve kullanıcı arayüzü ileti dizisini engelleyin. Yüzler algılandığında
cihaz kamerasından video karelerinde her algılama
ileti dizisi. detect()
öğesini çalıştırmak üzere web çalışanlarını uygulayarak bunu önleyebilirsiniz
ve detectForVideo()
yöntem başka bir ileti dizisinde.
Aşağıdaki kod, işlemin görev modeliyle nasıl yürütüldüğünü gösterir:
Resim
const image = document.getElementById("image") as HTMLImageElement; const faceLandmarkerResult = faceLandmarker.detect(image);
Video
await faceLandmarker.setOptions({ runningMode: "VIDEO" }); let lastVideoTime = -1; function renderLoop(): void { const video = document.getElementById("video"); if (video.currentTime !== lastVideoTime) { const faceLandmarkerResult = faceLandmarker.detectForVideo(video); processResults(detections); lastVideoTime = video.currentTime; } requestAnimationFrame(() => { renderLoop(); }); }
Yüz İşaretçisi görevi çalıştırmayla ilgili daha kapsamlı bilgi için bkz. kod örneği hakkında daha fazla bilgi edinin.
Sonuçları işleme ve görüntüleme
Yüz İşaretçisi, her algılama için bir sonuç nesnesi döndürür gerekir. Sonuç nesnesi, algılanan her yüz için bir yüz örgüsü içerir. koordinatlarını ekleyin. İsteğe bağlı olarak, sonuç nesnesi yüz ifadelerini ifade eden karışımlar ve yüz dönüşüm matrisi kullanarak algılanan önemli noktalara yüz efektleri uygulayın.
Aşağıda, bu görevdeki çıkış verilerinin bir örneği gösterilmektedir:
FaceLandmarkerResult:
face_landmarks:
NormalizedLandmark #0:
x: 0.5971359014511108
y: 0.485361784696579
z: -0.038440968841314316
NormalizedLandmark #1:
x: 0.3302789330482483
y: 0.29289937019348145
z: -0.09489090740680695
... (478 landmarks for each face)
face_blendshapes:
browDownLeft: 0.8296722769737244
browDownRight: 0.8096957206726074
browInnerUp: 0.00035583582939580083
browOuterUpLeft: 0.00035752105759456754
... (52 blendshapes for each face)
facial_transformation_matrixes:
[9.99158978e-01, -1.23036895e-02, 3.91213447e-02, -3.70770246e-01]
[1.66496094e-02, 9.93480563e-01, -1.12779640e-01, 2.27719707e+01]
...
Aşağıdaki resimde, görev çıkışının görselleştirmesi gösterilmektedir:
Yüz İşaretleyici örnek kodu, daha fazla bilgi edinmek için kod örneği