clipPathUnits

  • Revision slug: SVG/Attribute/clipPathUnits
  • Revision title: clipPathUnits
  • Revision id: 50828
  • Created:
  • Creator: Jeremie
  • Is current revision? No
  • Comment 157 words added, 114 words removed

Revision Content

« SVG Attribute reference home

The clipPathUnits attribute defines the coordinate system for the contents of the {{ SVGElement("clipPath") }} element.

If the clipPathUnits attribute is not specified, then the effect is as if a value of userSpaceOnUse were specified.

Note that values defined as a percentage inside the content of the {{ SVGElement("clipPath") }} are not affected by this attribute. It means that even if you set the value of maskContentUnits to objectBoundingBox, percentage values will be calculated as if the value of the attribute were userSpaceOnUse.

Usage context

Categories None
Value userSpaceOnUse | objectBoundingBox
Animatable Yes
Normative document SVG 1.1 (2nd Edition)
userSpaceOnUse
The contents of the {{ SVGElement("clipPath") }} element represent values in the current user coordinate system in place at the time when the {{ SVGElement("clipPath") }} element is referenced (i.e., the user coordinate system for the element referencing the {{ SVGElement("clipPath") }} element via the {{ SVGAttr("clip-path") }} attribute).
objectBoundingBox
The user coordinate system for the contents of the {{ SVGElement("clipPath") }} element is established using the bounding box of the element to which the clipping path is applied

Example

Elements

The following elements can use the clipPathUnits attribute

  • {{ SVGElement("clipPath") }}

Revision Source

<p>« <a href="/en/SVG/Attribute" title="en/SVG/Attribute">SVG Attribute reference home</a></p>
<p>The <code>clipPathUnits</code> attribute defines the coordinate system for the contents of the {{ SVGElement("clipPath") }} element.</p>
<p>If the <code>clipPathUnits</code> attribute is not specified, then the effect is as if a value of <code>userSpaceOnUse</code> were specified.</p>
<p>Note that values defined as a percentage inside the content of the {{ SVGElement("clipPath") }} are not affected by this attribute. It means that even if you set the value of <code>maskContentUnits</code> to <code>objectBoundingBox</code>, percentage values will be calculated as if the value of the attribute were <code>userSpaceOnUse</code>.</p>
<h2 id="Usage_context">Usage context</h2>
<table class="standard-table"> <tbody> <tr> <th scope="row">Categories</th> <td><em>None</em></td> </tr> <tr> <th scope="row">Value</th> <td><strong>userSpaceOnUse</strong> | objectBoundingBox</td> </tr> <tr> <th scope="row">Animatable</th> <td>Yes</td> </tr> <tr> <th scope="row">Normative document</th> <td><a class="external" href="http://www.w3.org/TR/SVG11/masking.html#ClipPathElementClipPathUnitsAttribute" title="http://www.w3.org/TR/SVG11/masking.html#ClipPathElementClipPathUnitsAttribute">SVG 1.1 (2nd Edition)</a></td> </tr> </tbody>
</table>
<dl> <dt>userSpaceOnUse</dt> <dd>The contents of the {{ SVGElement("clipPath") }} element represent values in the current user coordinate system in place at the time when the {{ SVGElement("clipPath") }} element is referenced (i.e., the user coordinate system for the element referencing the {{ SVGElement("clipPath") }} element via the {{ SVGAttr("clip-path") }} attribute).</dd> <dt>objectBoundingBox</dt> <dd>The user coordinate system for the contents of the {{ SVGElement("clipPath") }} element is established using the bounding box of the element to which the clipping path is applied</dd>
</dl>
<h2 id="Example">Example</h2>
<h2 id="Elements">Elements</h2>
<p>The following elements can use the <code>clipPathUnits</code> attribute</p>
<ul> <li>{{ SVGElement("clipPath") }}</li>
</ul>
Revert to this revision