एचटीएमएल संदर्भ

वर्णमाला द्वारा HTML श्रेणी के अनुसार HTML एचटीएमएल ब्राउज़र समर्थन एचटीएमएल गुण HTML वैश्विक गुण एचटीएमएल घटनाक्रम एचटीएमएल रंग एचटीएमएल कैनवास एचटीएमएल ऑडियो/वीडियो एचटीएमएल कैरेक्टर सेट एचटीएमएल सिद्धांत एचटीएमएल यूआरएल एनकोड एचटीएमएल भाषा कोड एचटीएमएल देश कोड HTTP संदेश HTTP तरीके पीएक्स से ईएम कन्वर्टर कुंजीपटल अल्प मार्ग


HTML कैनवास क्लिप () विधि

❮ HTML कैनवास संदर्भ

उदाहरण

कैनवास से 200*120 पिक्सेल के आयताकार क्षेत्र की क्लिप। फिर, एक लाल आयत बनाएं। केवल लाल आयत का वह भाग जो काटे गए क्षेत्र के अंदर दिखाई देता है:

आपका ब्राउज़रHTML5कैनवास्टैग का समर्थन नहीं करता है।

जावास्क्रिप्ट:

var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
// Clip a rectangular area
ctx.rect(50, 20, 200, 120);
ctx.stroke();
ctx.clip();
// Draw red rectangle after clip()
ctx.fillStyle = "red";
ctx.fillRect(0, 0, 150, 100);

ब्राउज़र समर्थन

तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो पूरी तरह से विधि का समर्थन करता है।

Method
clip() Yes 9.0 Yes Yes Yes

परिभाषा और उपयोग

क्लिप () विधि मूल कैनवास से किसी भी आकार और आकार के क्षेत्र को क्लिप करती है।

युक्ति: एक बार किसी क्षेत्र को क्लिप करने के बाद, भविष्य के सभी आरेखण क्लिप किए गए क्षेत्र तक सीमित रहेंगे (कैनवास पर अन्य क्षेत्रों तक पहुंच नहीं)। हालाँकि आप क्लिप () विधि का उपयोग करने से पहले सेव () विधि का उपयोग करके वर्तमान कैनवास क्षेत्र को सहेज सकते हैं, और भविष्य में किसी भी समय इसे (पुनर्स्थापना () विधि के साथ) पुनर्स्थापित कर सकते हैं।

जावास्क्रिप्ट सिंटैक्स: संदर्भ .क्लिप ();

❮ HTML कैनवास संदर्भ