HTML कैनवास quadraticCurveTo () विधि
उदाहरण
एक द्विघात बेज़ियर वक्र बनाएं:
जावास्क्रिप्ट:
var c = document.getElementById("myCanvas");
var ctx = c.getContext("2d");
ctx.beginPath();
ctx.moveTo(20, 20);
ctx.quadraticCurveTo(20, 100, 200, 20);
ctx.stroke();
ब्राउज़र समर्थन
तालिका में संख्याएं पहले ब्राउज़र संस्करण को निर्दिष्ट करती हैं जो पूरी तरह से विधि का समर्थन करता है।
Method | |||||
---|---|---|---|---|---|
quadraticCurveTo() | Yes | 9.0 | Yes | Yes | Yes |
परिभाषा और उपयोग
QuadraticCurveTo () विधि निर्दिष्ट नियंत्रण बिंदुओं का उपयोग करके वर्तमान पथ में एक बिंदु जोड़ती है जो द्विघात बेज़ियर वक्र का प्रतिनिधित्व करता है।
द्विघात बेज़ियर वक्र के लिए दो बिंदुओं की आवश्यकता होती है। पहला बिंदु एक नियंत्रण बिंदु है जिसका उपयोग द्विघात बेज़ियर गणना में किया जाता है और दूसरा बिंदु वक्र के लिए अंतिम बिंदु होता है। वक्र का प्रारंभिक बिंदु वर्तमान पथ का अंतिम बिंदु है। यदि कोई पथ मौजूद नहीं है, तो प्रारंभिक बिंदु को परिभाषित करने के लिए startPath() और moveTo() विधियों का उपयोग करें।
प्रारंभ बिंदु:
मूव टू( 20,20 )
नियंत्रण बिंदु:
द्विघात वक्र ( 20,100 , 200,20 )
अंतिम बिंदु:
द्विघात वक्र (20,100, 200,20 )
युक्ति: bezierCurveTo () विधि देखें। इसमें एक के बजाय दो नियंत्रण-बिंदु होते हैं।
जावास्क्रिप्ट सिंटैक्स: | संदर्भ .quadraticCurveTo( cpx,cpy,x,y ); |
---|
पैरामीटर मान
Parameter | Description | Play it |
---|---|---|
cpx | The x-coordinate of the Bézier control point | |
cpy | The y-coordinate of the Bézier control point | |
x | The x-coordinate of the ending point | |
y | The y-coordinate of the ending point |
❮ HTML कैनवास संदर्भ