رسم بیضی در SVG

رسم بیضی در SVG با استفاده از عنصر <ellipse>

با استفاده از عنصر <ellipse> می توانید یک بیضی را ایجاد کنید. 

یک بیضی کاملا شبیه یک دایره است اما با این تفاوت که یک بیضی دارای شعاع های x و y متفاوتی است ولی یک دایره دارای شعاع های x و y یکسان و مساوی است. 

نکته: برای درک موضوع بالا، بهتر بدانید که بیضی دارای دو شعاع متفاوت است. اما دایره تنها یک شعاع یکسان دارد. 

مثال 1

در این مثال یک بیضی را ایجاد می کنیم:

کد SVG شکل بالا را در زیر مشاهده می کنید:

توضیح کد بالا:

• خصوصیت cx، مختصات x از مرکز بیضی را مشخص می کند. 
• خصوصیت cy، مختصات y از مرکز بیضی را مشخص می کند. 
• خصوصیت rx، شعاع افقی بیضی را مشخص می کند. 
• خصوصیت ry، شعاع عمودی بیضی را مشخص می کند. 

مثال 2

در این مثال، سه بیضی را بر روی یکدیگر ایجاد می کنیم:

کد SVG بیضی های بالا، را می توانید در زیر مشاهده کنید:

مثال 3

در مثال پیش رو، دو بیضی را ایجاد می کنیم( یکی به رنگ زرد و یکی ب رنگ سفید):

در زیر کد SVG مورد نظر قرار دارد:

• قبلی
• بعدی