SVG <ellipse>

SVG अंगूठे - <ellipse>

<ellipse> एलिप्स को बनाने के लिए इस्तेमाल किया जाता है。

अंगूठे और गोला बहुत अधिक एक-दूसरे के समान हैं। अंतर का पाठ यह है कि अंगूठे के x और y दायरा के अंतर एक-दूसरे से अलग हैं, जबकि गोला के x और y दायरे समान हैं:

उदाहरण 1

इसमें एक अंगूठा बनाया गया है:

यह SVG कोड है:

<svg height="140" width="500">
  <ellipse cx="200" cy="80" rx="100" ry="50"
  style="fill:yellow;stroke:purple;stroke-width:2" />
</svg>

अपने आप से प्रयास करें

कोड व्याख्या:

• cx गुण का प्रयोग विकर्ण के केंद्र की x स्थिति को परिभाषित करता है
• cy गुण का प्रयोग विकर्ण के केंद्र की y स्थिति को परिभाषित करता है
• rx गुण का प्रयोग विकर्ण की अक्षीय दायरा को परिभाषित करता है
• ry गुण का प्रयोग विकर्ण की अड्डीय दायरा को परिभाषित करता है

उदाहरण 2

इसमें तीन एक-दूसरे पर आधारित अंगूठे बनाए गए हैं:

यह SVG कोड है:

<svg height="150" width="500">
  <ellipse cx="240" cy="100" rx="220" ry="30" style="fill:purple" />
  <ellipse cx="220" cy="70" rx="190" ry="20" style="fill:lime" />
  <ellipse cx="210" cy="45" rx="170" ry="15" style="fill:yellow" />
</svg>

अपने आप से प्रयास करें

उदाहरण 3

इसमें दो अंगूठे (एक पीला और एक सफेद) का समावेश है:

यह SVG कोड है:

<svg height="100" width="500">
  <ellipse cx="240" cy="50" rx="220" ry="30" style="fill:yellow" />
  <ellipse cx="220" cy="50" rx="190" ry="20" style="fill:white" />
</svg>

अपने आप से प्रयास करें