SVG 타원 - <타원>
<ellipse> 요소는 타원을 만드는 데 사용됩니다.
타원 밀접 원 관련이있다. 차이점은 원이 동일한 x 및 y 반경을 갖는다 타원이 서로 상이은 X 및 AY 반경을 갖는다는 것이다 :
예 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>
»그것을 자신을 시도 Code explanation:
- 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
다음 예제에서는 두 개의 타원 결합 (one yellow and one white) :
다음은 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>
»그것을 자신을 시도