HTML कैनवस bezierCurveTo() विधि
वर्णन और उपयोग
bezierCurveTo()
विधि का उपयोग करके तीन बार बेजीर वक्र लाइन के निर्धारित नियंत्रण बिन्दु को पथ में जोड़ें।
सूचना:तीन बार बेजीर वक्र लाइन को तीन बिन्दुओं की आवश्यकता है। पहले दो बिन्दु तीन बार बेजीर गणना में नियंत्रण बिन्दु हैं, तीसरा बिन्दु वक्र का समाप्त बिन्दु है। वक्र का शुरूआती बिन्दु वर्तमान पथ के अंतिम बिन्दु है। यदि पथ मौजूद नहीं है, तो कृपया beginPath() और moveTo() विधि का उपयोग करके शुरूआती बिन्दु को निर्धारित करें।

- शुरूआती बिन्दु: moveTo(
20
,20
) - नियंत्रण बिन्दु 1: bezierCurveTo(
20
,100
,200,100,200,20) - नियंत्रण बिन्दु 2: bezierCurveTo(20,100,
200
,100
,200,20) - समाप्त बिन्दु: bezierCurveTo(20,100,200,100,
200
,20
)
सूचना:देखें: quadraticCurveTo() विधि। यह दो नहीं सबसे अधिक नियंत्रण बिन्दु है, बल्कि एक है।
उदाहरण
तीन बार बेजीर वक्र लाइन दूसरा:
JavaScript:
var c=document.getElementById("myCanvas"); var ctx=c.getContext("2d"); ctx.beginPath(); ctx.moveTo(20,20); ctx.bezierCurveTo(20,100,200,100,200,20); ctx.stroke();
व्याकरण
context.bezierCurveTo(cp1x,cp1y,cp2x,cp2y,x,y);
पारामीटर मान
पारामीटर | वर्णन |
---|---|
cp1x | पहले बेजेलर नियंत्रण बिन्दु के x स्थानांक |
cp1y | पहले बेजेलर नियंत्रण बिन्दु के y स्थानांक |
cp2x | दूसरे बेजेलर नियंत्रण बिन्दु के x स्थानांक |
cp2y | दूसरे बेजेलर नियंत्रण बिन्दु के y स्थानांक |
x | समाप्ती के x स्थानांक |
y | समाप्ती के y स्थानांक |
ब्राउज़र समर्थन
तालिका में दिए गए नंबरों में पहली बार इस गुण को पूरी तरह से समर्थन देने वाले ब्राउज़र का संस्करण निर्दिष्ट किया गया है。
च्रोम | एज | फायरफॉक्स | सैफारी | ओपेरा |
---|---|---|---|---|
च्रोम | एज | फायरफॉक्स | सैफारी | ओपेरा |
4.0 | 9.0 | 3.6 | 4.0 | 10.1 |
टिप्पणी:इंटरनेट एक्सप्लोरर 8 और अधिक पुरानी संस्करण <canvas> एलीमेंट को समर्थन नहीं देते हैं。