diff options
Diffstat (limited to 'files/ko/web/api/svgrect/index.html')
| -rw-r--r-- | files/ko/web/api/svgrect/index.html | 90 |
1 files changed, 90 insertions, 0 deletions
diff --git a/files/ko/web/api/svgrect/index.html b/files/ko/web/api/svgrect/index.html new file mode 100644 index 0000000000..c006db08c1 --- /dev/null +++ b/files/ko/web/api/svgrect/index.html @@ -0,0 +1,90 @@ +--- +title: SVGRect +slug: Web/API/SVGRect +translation_of: Web/API/SVGRect +--- +<div>{{APIRef("SVG")}}</div> + +<p id="sect1"><strong><code>SVGRect</code></strong>는 직사각형을 의미합니다. 직사각형은 최소 x값과 최소 y값, 그리고 양수로 제한되는 폭과 높이를 식별하는 x와 y 좌표 쌍으로 구성됩니다.</p> + +<p><strong><code>SVGRect</code></strong> 오브젝트는 읽기 전용으로 지정될 수 있습니다. 이 말은 오브젝트를 수정하려는 시도가 있을 때 exception을 발생시킵니다.</p> + +<p>{{InheritanceDiagram(600, 140)}}</p> + +<h2 id="프로퍼티">프로퍼티</h2> + +<p><em>이 인터페이스는 부모로 부터 프로퍼티를 상속받습니다. {{domxref("SVGGeometryElement")}}.</em></p> + +<dl> + <dt>{{domxref("SVGRect.x")}} {{ReadOnlyInline}}</dt> + <dd>이 좌표의 정확한 효과는 각 element에 따라 다릅니다. 속성을 지정하지 않으면 0 값이 지정된 것처럼 효과가 나타납니다.</dd> + <dt>{{domxref("SVGRect.y")}} {{ReadOnlyInline}}</dt> + <dd>이 좌표의 정확한 효과는 각 element에 따라 다릅니다. 속성을 지정하지 않으면 0 값이 지정된 것처럼 효과가 나타납니다.</dd> + <dt>{{domxref("SVGRect.width")}} {{ReadOnlyInline}}</dt> + <dd>이것은 사각형의 너비를 나타냅니다. 음수 값은 에러가 발생합니다. 0 값은 element의 렌더링을 불가능하게 합니다. </dd> + <dt>{{SVGAttr("SVGRect.height")}} {{ReadOnlyInline}}</dt> + <dd>이것은 사각형의 높이를 나타냅니다. 음수 값은 에러가 발생합니다. 0 값은 element의 렌더링을 불가능하게 합니다. </dd> +</dl> + +<p><strong>Exceptions on setting:</strong> A {{domxref("DOMException")}} with the code <code>NO_MODIFICATION_ALLOWED_ERR</code> 는 읽기 전용 속성을 바꾸려 할 때 발생합니다.</p> + +<h2 id="메소드">메소드</h2> + +<p><em>이 인터페이스는 부모로 부터 프로퍼티를 상속받습니다. {{domxref("SVGGeometryElement")}}.</em></p> + +<h2 id="예">예</h2> + +<p>rect 인터페이스의 간단한 사용법입니다. (매 클릭마다 rect 인터페이스의 색을 변경합니다.)</p> + +<h3 id="SVG_content">SVG content</h3> + +<pre class="brush: html"><svg xmlns="http://www.w3.org/2000/svg" version="1.1"> + <rect width="300" height="100" id="myrect" onclick="doRectClick()" + style="fill:rgb(0,0,255);stroke-width:1;stroke:rgb(0,0,0)" /> + <text x="60" y="40" fill="white" font-size="40" + onclick="doRectClick();">Click Me</text> +</svg> +</pre> + +<h3 id="JavaScript_content">JavaScript content</h3> + +<pre class="brush: js">function doRectClick(){ + var myrect = document.getElementById('myrect'); + var r = Math.floor(Math.random() * 255); + var g = Math.floor(Math.random() * 255); + var b = Math.floor(Math.random() * 255); + myrect.style.fill = 'rgb(' + r + ', ' + g + ' , ' + b + ')'; +} +</pre> + +<p><em>Click the rect.</em></p> + +<p>{{EmbedLiveSample('Example', '', '', '', 'Web/API/SVGRect')}}</p> + +<h2 id="상세">상세</h2> + +<table class="standard-table"> + <tbody> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + <tr> + <td>{{SpecName("SVG2", "shapes.html#InterfaceSVGRectElement", "SVGRectElement")}}</td> + <td>{{Spec2("SVG2")}}</td> + <td>Changed the inheritance from {{domxref("SVGElement")}} to {{domxref("SVGGeometryElement")}} and removed the implemented interfaces {{domxref("SVGTests")}}, {{domxref("SVGLangSpace")}}, {{domxref("SVGExternalResourcesRequired")}}, {{domxref("SVGStylable")}}, and {{domxref("SVGTransformable")}}.</td> + </tr> + <tr> + <td>{{SpecName("SVG1.1", "shapes.html#InterfaceSVGRectElement", "SVGRectElement")}}</td> + <td>{{Spec2("SVG1.1")}}</td> + <td>Initial definition</td> + </tr> + </tbody> +</table> + +<h2 id="브라우저_호환성">브라우저 호환성</h2> + + + +<p>{{Compat("api.SVGRect")}}</p> |