पेश है Google AI Edge Portal: बड़े पैमाने पर एज एआई का बेंचमार्क. निजी झलक के दौरान ऐक्सेस का अनुरोध करने के लिए, साइन-अप करें.

वेब के लिए फ़ेस लैंडमार्क की पहचान करने वाली गाइड

MediaPipe Face Landmarker टास्क की मदद से, इमेज और वीडियो में चेहरे के लैंडमार्क और चेहरे के भावों का पता लगाया जा सकता है. इस टास्क का इस्तेमाल, इंसानों के चेहरे के भावों का पता लगाने, चेहरे पर फ़िल्टर और इफ़ेक्ट लगाने, और वर्चुअल अवतार बनाने के लिए किया जा सकता है. इस टास्क के लिए, मशीन लर्निंग (एमएल) मॉडल का इस्तेमाल किया जाता है. ये मॉडल, एक इमेज या लगातार स्ट्रीम की जा रही इमेज के साथ काम कर सकते हैं. इस टास्क से, चेहरे के 3D लैंडमार्क और ब्लेंडशेप स्कोर (चेहरे के भाव दिखाने वाले कोएफ़िशिएंट) मिलते हैं. इनसे रीयल-टाइम में चेहरे की बारीकी से जानकारी मिलती है. साथ ही, ट्रांसफ़ॉर्मेशन मैट्रिक्स मिलते हैं, ताकि इफ़ेक्ट रेंडर करने के लिए ज़रूरी ट्रांसफ़ॉर्मेशन किए जा सकें.

इन निर्देशों में, वेब और JavaScript ऐप्लिकेशन के लिए Face Landmarker का इस्तेमाल करने का तरीका बताया गया है. इस टास्क की सुविधाओं, मॉडल, और कॉन्फ़िगरेशन के विकल्पों के बारे में ज़्यादा जानने के लिए, खास जानकारी देखें.

कोड का उदाहरण

फ़ेस लैंडमार्कर के लिए दिए गए उदाहरण कोड में, इस टास्क को JavaScript में पूरी तरह से लागू करने का तरीका बताया गया है. इस कोड की मदद से, इस टास्क को टेस्ट किया जा सकता है. साथ ही, अपना फ़ेस लैंडमार्कर ऐप्लिकेशन बनाना शुरू किया जा सकता है. सिर्फ़ वेब ब्राउज़र का इस्तेमाल करके, फ़ेस लैंडमार्कर उदाहरण को देखा, चलाया, और उसमें बदलाव किया जा सकता है.

सेटअप

इस सेक्शन में, खास तौर पर Face Landmarker का इस्तेमाल करने के लिए, डेवलपमेंट एनवायरमेंट सेट अप करने का तरीका बताया गया है. वेब और JavaScript डेवलपमेंट एनवायरमेंट सेट अप करने के बारे में सामान्य जानकारी के लिए, वेब के लिए सेटअप गाइड देखें. इसमें प्लैटफ़ॉर्म के वर्शन से जुड़ी ज़रूरी शर्तें भी शामिल हैं.

JavaScript पैकेज

MediaPipe @mediapipe/tasks-vision NPM पैकेज के ज़रिए, फ़ेस लैंडमार्कर कोड उपलब्ध है. इन लाइब्रेरी को ढूंढने और डाउनलोड करने के लिए, प्लैटफ़ॉर्म की सेटअप गाइड में दिए गए निर्देशों का पालन करें.

ज़रूरी पैकेज को NPM के ज़रिए इंस्टॉल किया जा सकता है. इसके लिए, यह कमांड इस्तेमाल करें:

npm install @mediapipe/tasks-vision

अगर आपको कॉन्टेंट डिलीवरी नेटवर्क (सीडीएन) सेवा के ज़रिए टास्क कोड इंपोर्ट करना है, तो अपनी एचटीएमएल फ़ाइल में <head> टैग में यह कोड जोड़ें:

<!-- You can replace JSDeliver with another CDN if you prefer to -->
<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.mjs"
    crossorigin="anonymous"></script>
</head>

मॉडल

MediaPipe Face Landmarker टास्क के लिए, ट्रेनिंग दिया गया ऐसा मॉडल ज़रूरी है जो इस टास्क के साथ काम करता हो. फ़ेस लैंडमार्कर के लिए उपलब्ध ट्रेन किए गए मॉडल के बारे में ज़्यादा जानने के लिए, टास्क की खास जानकारी वाला मॉडल सेक्शन देखें.

कोई मॉडल चुनें और उसे डाउनलोड करें. इसके बाद, उसे अपने प्रोजेक्ट डायरेक्ट्री में सेव करें:

<dev-project-root>/app/shared/models/

टास्क बनाना

इनफ़रेंस चलाने के लिए टास्क तैयार करने के लिए, फ़ेस लैंडमार्कर createFrom...() फ़ंक्शन में से किसी एक का इस्तेमाल करें. ट्रेन किए गए मॉडल की फ़ाइल के रिलेटिव या ऐब्सलूट पाथ के साथ, createFromModelPath() फ़ंक्शन का इस्तेमाल करें. अगर आपका मॉडल पहले से ही मेमोरी में लोड है, तो createFromModelBuffer() तरीके का इस्तेमाल किया जा सकता है.

नीचे दिए गए कोड के उदाहरण में, टास्क सेट अप करने के लिए createFromOptions() फ़ंक्शन का इस्तेमाल करने का तरीका दिखाया गया है. createFromOptions फ़ंक्शन की मदद से, कॉन्फ़िगरेशन के विकल्पों का इस्तेमाल करके, Face Landmarker को पसंद के मुताबिक बनाया जा सकता है. ज़्यादा जानकारी के लिए, कॉन्फ़िगरेशन के विकल्प लेख पढ़ें.

यहां दिए गए कोड में, कस्टम विकल्पों के साथ टास्क बनाने और उसे कॉन्फ़िगर करने का तरीका बताया गया है:

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
    });

कॉन्फ़िगरेशन विकल्प

इस टास्क में, वेब और JavaScript ऐप्लिकेशन के लिए कॉन्फ़िगरेशन के ये विकल्प उपलब्ध हैं:

विकल्प का नाम	ब्यौरा	वैल्यू की सीमा	डिफ़ॉल्ट मान
`running_mode`	यह कुकी, टास्क के रनिंग मोड को सेट करती है. इसके दो मोड हैं: IMAGE: यह मोड, एक इमेज वाले इनपुट के लिए होता है. VIDEO: यह वीडियो के डिकोड किए गए फ़्रेम या कैमरे जैसे इनपुट डेटा की लाइव स्ट्रीम के लिए मोड है.	{`IMAGE, VIDEO`}	`IMAGE`
`numFaces`	`FaceLandmarker` की मदद से, ज़्यादा से ज़्यादा चेहरों का पता लगाया जा सकता है. स्मूदिंग सिर्फ़ तब लागू होती है, जब `num_faces` को 1 पर सेट किया जाता है.	`Integer > 0`	`1`
`minFaceDetectionConfidence`	चेहरे का पता लगाने की प्रोसेस को सफल मानने के लिए, कम से कम कॉन्फ़िडेंस स्कोर.	`Float [0.0,1.0]`	`0.5`
`minFacePresenceConfidence`	चेहरे की मौजूदगी का कम से कम कॉन्फ़िडेंस स्कोर स्कोर, चेहरे के लैंडमार्क का पता लगाने की सुविधा में.	`Float [0.0,1.0]`	`0.5`
`minTrackingConfidence`	चेहरे को ट्रैक करने के लिए, कम से कम कॉन्फ़िडेंस स्कोर. इससे यह तय होता है कि चेहरे को ट्रैक करने की प्रोसेस पूरी हुई या नहीं.	`Float [0.0,1.0]`	`0.5`
`outputFaceBlendshapes`	इससे पता चलता है कि फ़ेस लैंडमार्कर, फ़ेस ब्लेंडशेप आउटपुट करता है या नहीं. चेहरे के 3D मॉडल को रेंडर करने के लिए, चेहरे के ब्लेंडशेप का इस्तेमाल किया जाता है.	`Boolean`	`False`
`outputFacialTransformationMatrixes`	इससे यह तय होता है कि FaceLandmarker, चेहरे के ट्रांसफ़ॉर्मेशन मैट्रिक्स को आउटपुट करता है या नहीं. FaceLandmarker, मैट्रिक्स का इस्तेमाल करके चेहरे के लैंडमार्क को कैननिकल फ़ेस मॉडल से पहचाने गए चेहरे में बदलता है. इससे उपयोगकर्ता, पहचाने गए लैंडमार्क पर इफ़ेक्ट लागू कर पाते हैं.	`Boolean`	`False`

डेटा तैयार करना

चेहरे की पहचान करने वाला लैंडमार्कर, इमेज में चेहरों का पता लगा सकता है. इमेज किसी भी ऐसे फ़ॉर्मैट में हो सकती है जो होस्ट ब्राउज़र के साथ काम करता हो. यह टास्क, डेटा इनपुट की प्रीप्रोसेसिंग को भी मैनेज करता है. इसमें इमेज का साइज़ बदलना, उसे घुमाना, और वैल्यू को सामान्य करना शामिल है. वीडियो में चेहरों की पहचान करने के लिए, एपीआई का इस्तेमाल किया जा सकता है. इससे एक बार में एक फ़्रेम को तुरंत प्रोसेस किया जा सकता है. इसके लिए, फ़्रेम के टाइमस्टैंप का इस्तेमाल करके यह पता लगाया जा सकता है कि वीडियो में चेहरे कब दिखते हैं.

टास्क को रन करना

फ़ेस लैंडमार्कर, अनुमान लगाने के लिए detect() (रनिंग मोड IMAGE के साथ) और detectForVideo() (रनिंग मोड VIDEO के साथ) तरीकों का इस्तेमाल करता है. यह टास्क, डेटा को प्रोसेस करता है, चेहरों को पहचानता है, और फिर नतीजे दिखाता है.

Face Landmarker detect() और detectForVideo() के तरीकों को एक साथ चलाया जाता है. इससे यूज़र इंटरफ़ेस थ्रेड ब्लॉक हो जाती है. अगर आपको किसी डिवाइस के कैमरे से वीडियो फ़्रेम में चेहरों का पता चलता है, तो हर पहचान मुख्य थ्रेड को ब्लॉक कर देती है. detect() और detectForVideo() तरीकों को किसी अन्य थ्रेड पर चलाने के लिए, वेब वर्कर लागू करके ऐसा होने से रोका जा सकता है.

नीचे दिए गए कोड में, टास्क मॉडल की मदद से प्रोसेसिंग को लागू करने का तरीका बताया गया है:

इमेज

const image = document.getElementById("image") as HTMLImageElement;
const faceLandmarkerResult = faceLandmarker.detect(image);

वीडियो

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();
  });
}

चेहरे की पहचान करने वाले लैंडमार्कर टास्क को ज़्यादा बेहतर तरीके से लागू करने के लिए, उदाहरण देखें.

नतीजों को मैनेज करना और दिखाना

फेस लैंडमार्कर, हर पहचान के लिए एक नतीजा ऑब्जेक्ट दिखाता है. नतीजे के ऑब्जेक्ट में, पहचान किए गए हर चेहरे के लिए फ़ेस मेश होता है. साथ ही, हर चेहरे के लैंडमार्क के लिए कोऑर्डिनेट होते हैं. इसके अलावा, नतीजे वाले ऑब्जेक्ट में ब्लेंडशेप भी शामिल हो सकते हैं. ये ब्लेंडशेप, चेहरे के भावों को दिखाते हैं. साथ ही, इसमें चेहरे के ट्रांसफ़ॉर्मेशन मैट्रिक्स भी शामिल हो सकते हैं, ताकि पहचाने गए लैंडमार्क पर फ़ेस इफ़ेक्ट लागू किए जा सकें.

इस टास्क के आउटपुट डेटा का उदाहरण यहां दिया गया है:

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]
    ...

नीचे दी गई इमेज में, टास्क के आउटपुट का विज़ुअलाइज़ेशन दिखाया गया है:

एक व्यक्ति की इमेज, जिसमें उसके चेहरे के अलग-अलग हिस्सों को ज्यामितीय तरीके से मैप किया गया है. इससे उसके चेहरे के आकार और डाइमेंशन के बारे में पता चलता है

चेहरे की पहचान करने वाले मॉडल के उदाहरण के तौर पर दिए गए कोड में बताया गया है कि टास्क से मिले नतीजों को कैसे दिखाया जाए. इसके लिए, उदाहरण देखें