पेश है LiteRT: यह, डिवाइस में मौजूद एआई के लिए Google की बेहतरीन परफ़ॉर्मेंस वाला रनटाइम है. इसे पहले TensorFlow Lite के नाम से जाना जाता था.

इस पेज का अनुवाद Cloud Translation API से किया गया है.

वेब के लिए इंटरैक्टिव इमेज सेगमेंटेशन गाइड

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

कोड का उदाहरण

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

सेटअप

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

JavaScript पैकेज

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

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

npm install --save @mediapipe/tasks-vision

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

<head>
  <script src="https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision/vision_bundle.js"
    crossorigin="anonymous"></script>
</head>

मॉडल

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

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

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

टास्क बनाना

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

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

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

async function createSegmenter() {
  const vision = await FilesetResolver.forVisionTasks(
    "https://cdn.jsdelivr.net/npm/@mediapipe/tasks-vision@latest/wasm"
  );

  interactiveSegmenter = await InteractiveSegmenter.createFromOptions(vision, {
    baseOptions: {
      modelAssetPath:
        "https://storage.googleapis.com/mediapipe-tasks/interactive_segmenter/ptm_512_hdt_ptm_woid.tflite"
    },
  });
}
createSegmenter();

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

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

विकल्प का नाम	ब्यौरा	वैल्यू की सीमा	डिफ़ॉल्ट मान
`outputCategoryMask`	अगर इसे `True` पर सेट किया जाता है, तो आउटपुट में uint8 इमेज के तौर पर सेगमेंटेशन मास्क शामिल होता है. इसमें हर पिक्सल की वैल्यू से पता चलता है कि पिक्सल, दिलचस्पी के क्षेत्र में मौजूद ऑब्जेक्ट का हिस्सा है या नहीं.	{`True, False`}	`False`
`outputConfidenceMasks`	अगर `True` पर सेट किया जाता है, तो आउटपुट में फ़्लोट वैल्यू वाली इमेज के तौर पर सेगमेंटेशन मास्क शामिल होता है. इसमें हर फ़्लोट वैल्यू, इस बात की संभावना दिखाती है कि पिक्सल, दिलचस्पी के इलाके में मौजूद ऑब्जेक्ट का हिस्सा है.	{`True, False`}	`True`
`displayNamesLocale`	टास्क के मॉडल के मेटाडेटा में दिए गए डिसप्ले नेम के लिए, लेबल की भाषा सेट करता है. हालांकि, ऐसा तब ही किया जाता है, जब वह भाषा उपलब्ध हो. अंग्रेज़ी के लिए, डिफ़ॉल्ट तौर पर `en` होता है. TensorFlow Lite मेटाडेटा राइटर एपीआई का इस्तेमाल करके, कस्टम मॉडल के मेटाडेटा में स्थानीय भाषा के लेबल जोड़े जा सकते हैं	स्थानीय भाषा का कोड	en

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

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

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

टास्क चलाना

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

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

const image = document.getElementById("image") as HTMLImageElement;
interactiveSegmenter.segment(
  image,
  {
    keypoint: {
      x: event.offsetX / event.target.width,
      y: event.offsetY / event.target.height
    }
  },
  callback);

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

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

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

इस टास्क के आउटपुट डेटा के बारे में ज़्यादा जानकारी इन सेक्शन में दी गई है:

कैटगरी मास्क

नीचे दी गई इमेज में, कैटगरी वैल्यू मास्क के लिए टास्क के आउटपुट को विज़ुअलाइज़ किया गया है. इसमें, दिलचस्पी के पॉइंट एरिया को दिखाया गया है. हर पिक्सल एक uint8 वैल्यू होती है. इससे पता चलता है कि पिक्सल, दिलचस्पी के क्षेत्र में मौजूद ऑब्जेक्ट का हिस्सा है या नहीं. दूसरी इमेज में काले और सफ़ेद रंग का सर्कल, चुने गए विषय के बारे में बताता है.

पत्तियों के ढेर के बीच खड़ा कुत्ता पिछली इमेज में कुत्ते का आउटलाइन

ओरिजनल इमेज और कैटगरी मास्क का आउटपुट. Pascal VOC 2012 के डेटासेट से ली गई सोर्स इमेज.

कॉन्फ़िडेंस मास्क

कॉन्फ़िडेंस मास्क के आउटपुट में, हर इमेज इनपुट चैनल के लिए [0, 1] के बीच फ़्लोट वैल्यू होती हैं. ज़्यादा वैल्यू से यह पता चलता है कि इमेज पिक्सल, दिलचस्पी के इलाके में मौजूद ऑब्जेक्ट का हिस्सा है.

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