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

از عنصر <circle> برای ایجاد یک دایره استفاده می شود: 

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

مثال

<svg height="100" width="100">
  <circle cx="50" cy="50" r="40" stroke="black" stroke-width="3" fill="red" />
</svg>
خودتان امتحان کنید »

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

  • خصوصیات cx و cy به ترتیب، مختصات x و y از مرکز دایره را مشخص می کنند. در صورتی که cx و cy مشخص نشوند، مرکز دایره به مختصات (0,0) در نظر گرفته خواهد شد. 
  • خصوصیت r، شعاع دایره را مشخص می کند.