cx

ยซ SVG Attribute reference home

<circle>๊ณผ  <ellipse>์—˜๋ฆฌ๋จผํŠธ์—์„œ ์‚ฌ์šฉ๋  ๊ฒฝ์šฐ, ๋ณธ ์†์„ฑ์€ ์—˜๋ฆฌ๋จผํŠธ์˜ ์ค‘์‹ฌ์˜ x์ถ•์˜ ์œ„์น˜๋ฅผ ๋‚˜ํƒ€๋‚ธ๋‹ค. ์†์„ฑ์ด ์ •์˜๋˜์–ด์žˆ์ง€ ์•Š์„ ๊ฒฝ์šฐ ์†์„ฑ ๊ฐ’์ด "0"์ผ ๊ฒฝ์šฐ์™€ ๋™์ผํ•œ ํ˜•ํƒœ๋ฅผ ๋‚˜ํƒ€๋‚ด๊ฒŒ ๋œ๋‹ค.

<radialGradient> ์—˜๋ฆฌ๋จผํŠธ์˜ ๊ฒฝ์šฐ์—๋Š” ๋ณธ ์†์„ฑ์€ ์›ํ˜• ๊ทธ๋ž˜๋””์–ธํŠธ์˜ ๊ฐ€์žฅ ํฐ ์›์˜ x์ถ•์˜ ์œ„์น˜๋ฅผ ๋‚˜ํƒ€๋‚ธ๋‹ค. ๊ทธ๋ž˜๋””์–ธํŠธ๋Š” ๊ฐ€์žฅ ํฐ ์›์˜ ๋‘˜๋ ˆ์™€ ์ผ์น˜ํ•  ์ˆ˜ ์žˆ๋„๋ก ๊ทธ๋ ค์งˆ๊ฒƒ์ž…๋‹ˆ๋‹ค. ์†์„ฑ์ด ์ •์˜๋˜์–ด์žˆ์ง€ ์•Š์„ ๊ฒฝ์šฐ ์†์„ฑ ๊ฐ’์ด 50%์ผ ๊ฒฝ์šฐ์™€ ๋™์ผํ•œ ํšจ๊ณผ๋ฅผ ๋‚˜ํƒ€๋‚ด๊ฒŒ ๋œ๋‹ค.

Usage context

Categories None
Value <coordinate>
Animatable Yes
Normative document SVG 1.1 (2nd Edition): The circle element
SVG 1.1 (2nd Edition): The ellipse element
SVG 1.1 (2nd Edition): The radialGradient element

<coordinate>

A <coordinate> is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the relevant axis (the x-axis for X coordinates, the y-axis for Y coordinates). Its syntax is the same as that for <length>.

Within the SVG DOM, a <coordinate> is represented as an SVGLength or an SVGAnimatedLength.

์˜ˆ์‹œ

  <svg width="120" height="220"
     viewPort="0 0 120 120" version="1.1"
     xmlns="http://www.w3.org/2000/svg">

    <style type="text/css" >

      <![CDATA[
       circle.circleClass {
       stroke: #006600;
       fill:   #cc0000;
    }

      ]]>
    </style>
     <circle  class="circleClass"   cx="40" cy="50" r="26"/>
</svg>

์—˜๋ฆฌ๋จผํŠธ

๋‹ค์Œ ์—˜๋ฆฌ๋จผํŠธ์—์„œ cx์†์„ฑ์„ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ์Šต๋‹ˆ๋‹ค.