वेब के लिए लैंडमार्क का पता लगाने वाली गाइड

MediaPipe Pose लैंडमार्क टास्क की मदद से, किसी इमेज या वीडियो में मानव शरीर की लैंडमार्क का पता लगाया जा सकता है. इस टास्क का इस्तेमाल, शरीर के मुख्य जगहों की पहचान करने, पॉस्चर का विश्लेषण करने, और शरीर की गतिविधियों को कैटगरी में बांटने के लिए किया जा सकता है. यह टास्क मशीन लर्निंग (एमएल) मॉडल का इस्तेमाल करता है, जो एक इमेज या वीडियो के साथ काम करता है. इस टास्क में, इमेज को निर्देशांकों और 3-डाइमेंशन वाले दुनिया के निर्देशांकों में शरीर की जगहों को दिखाने की सुविधा मिलती है.

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

कोड का उदाहरण

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

सेटअप

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

JavaScript पैकेज

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

नीचे दिए गए निर्देश का इस्तेमाल करके, एनपीएम से ज़रूरी पैकेज इंस्टॉल किए जा सकते हैं:

npm install @mediapipe/tasks-vision

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

<!-- 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>

मॉडल

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

कोई मॉडल चुनें और उसे डाउनलोड करें और फिर उसे अपनी प्रोजेक्ट डायरेक्ट्री में स्टोर करें:

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

टास्क बनाएं

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

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

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

const vision = await FilesetResolver.forVisionTasks(
  // path/to/wasm/root
  "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
);
const poseLandmarker = await poseLandmarker.createFromOptions(
    vision,
    {
      baseOptions: {
        modelAssetPath: "path/to/model"
      },
      runningMode: runningMode
    });

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

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

विकल्प का नाम ब्यौरा वैल्यू रेंज डिफ़ॉल्ट मान
runningMode टास्क के लिए, रनिंग मोड सेट करता है. इसके दो मोड हैं:

इमेज: सिंगल इमेज इनपुट के लिए मोड.

वीडियो: यह मोड, किसी वीडियो के डिकोड किए गए फ़्रेम या इनपुट डेटा की लाइवस्ट्रीम के दौरान होता है, जैसे कि कैमरे से.
{IMAGE, VIDEO} IMAGE
numPoses पोज़ लैंडमार्कर की मदद से, ज़्यादा से ज़्यादा कितनी मुद्राओं का पता लगाया जा सकता है. Integer > 0 1
minPoseDetectionConfidence पोज़ पहचान के लिए कम से कम कॉन्फ़िडेंस स्कोर को सफल माना जाएगा. Float [0.0,1.0] 0.5
minPosePresenceConfidence पोज़ लैंडमार्क की पहचान में पोज़ वाली मौजूदगी के स्कोर का कम से कम कॉन्फ़िडेंस स्कोर. Float [0.0,1.0] 0.5
minTrackingConfidence पोज़ ट्रैकिंग के लिए ज़रूरी सबसे कम कॉन्फ़िडेंस स्कोर. Float [0.0,1.0] 0.5
outputSegmentationMasks पोज़ लैंडमार्क में दिखाए गए पोज़ के लिए, सेगमेंटेशन मास्क दिखाएगा या नहीं. Boolean False

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

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

टास्क चलाएं

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

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

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

Image

const image = document.getElementById("image") as HTMLImageElement;
const poseLandmarkerResult = poseLandmarker.detect(image);

वीडियो

await poseLandmarker.setOptions({ runningMode: "VIDEO" });

let lastVideoTime = -1;
function renderLoop(): void {
  const video = document.getElementById("video");

  if (video.currentTime !== lastVideoTime) {
    const poseLandmarkerResult = poseLandmarker.detectForVideo(video);
    processResults(detections);
    lastVideoTime = video.currentTime;
  }

  requestAnimationFrame(() => {
    renderLoop();
  });
}

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

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

'पोज़ लैंडमार्क' हर बार चलाए जाने के लिए, एक poseLandmarkerResult ऑब्जेक्ट दिखाता है. नतीजे के ऑब्जेक्ट में, हर पोज़ लैंडमार्क के लिए निर्देशांक होते हैं.

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

PoseLandmarkerResult:
  Landmarks:
    Landmark #0:
      x            : 0.638852
      y            : 0.671197
      z            : 0.129959
      visibility   : 0.9999997615814209
      presence     : 0.9999984502792358
    Landmark #1:
      x            : 0.634599
      y            : 0.536441
      z            : -0.06984
      visibility   : 0.999909
      presence     : 0.999958
    ... (33 landmarks per pose)
  WorldLandmarks:
    Landmark #0:
      x            : 0.067485
      y            : 0.031084
      z            : 0.055223
      visibility   : 0.9999997615814209
      presence     : 0.9999984502792358
    Landmark #1:
      x            : 0.063209
      y            : -0.00382
      z            : 0.020920
      visibility   : 0.999976
      presence     : 0.999998
    ... (33 world landmarks per pose)
  SegmentationMasks:
    ... (pictured below)

आउटपुट में हर लैंडमार्क के लिए, सामान्य निर्देशांक (Landmarks) और वर्ल्ड निर्देशांक (WorldLandmarks) दोनों होते हैं.

आउटपुट में ये सामान्य निर्देशांक (Landmarks) होते हैं:

  • x और y: मशहूर निर्देशांक, इमेज की चौड़ाई (x) और ऊंचाई (y) के हिसाब से 0.0 से 1.0 के बीच सामान्य किए जाते हैं.

  • z: लैंडमार्क की गहराई, जहां मूल रूप से कूल्हे के बीच में गहराई होती है. इसकी वैल्यू जितनी छोटी होगी, लैंडमार्क कैमरे के उतना ही करीब होगा. z की तीव्रता करीब x के बराबर स्केल का इस्तेमाल करती है.

  • visibility: इमेज में लैंडमार्क के दिखने की संभावना कितनी होती है.

आउटपुट में नीचे दिए गए दुनिया के निर्देशांक शामिल हैं (WorldLandmarks):

  • x, y, और z: असल दुनिया में 3-डाइमेंशन वाले निर्देशांक, मीटर में. इस तरह के निर्देशांक, कूल्हे की शुरुआत की जगह होते हैं.

  • visibility: इमेज में लैंडमार्क के दिखने की संभावना कितनी होती है.

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

वैकल्पिक सेगमेंटेशन मास्क, इस बात की संभावना बताता है कि हर पिक्सल किसी व्यक्ति से जुड़ा है या नहीं. यह इमेज, टास्क के आउटपुट का सेगमेंटेशन मास्क है:

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