SVGPatternElement

In This Article

The SVGPatternElement interface corresponds to the <pattern> element.

  <div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 23.333333333333332%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 140" preserveAspectRatio="xMinYMin meet"><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25  121,20  121,30  111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/Node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="188.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Node</text></a><polyline points="226,25  236,20  236,30  226,25" stroke="#D4DDE4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/Element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="303.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Element</text></a><polyline points="341,25  351,20  351,30  341,25" stroke="#D4DDE4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/SVGElement" target="_top"><rect x="381" y="1" width="100" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text  x="431" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">SVGElement</text></a><polyline points="481,25  491,20  491,30  481,25" stroke="#D4DDE4" fill="none"/><line x1="491" y1="25" x2="499" y2="25" stroke="#D4DDE4"/><line x1="499" y1="25" x2="499" y2="90" stroke="#D4DDE4"/><line x1="499" y1="90" x2="482" y2="90" stroke="#D4DDE4"/><a xlink:href="https://developer.mozilla.org/en-US/docs/Web/API/SVGPatternElement" target="_top"><rect x="311" y="65" width="170" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text  x="396" y="94" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">SVGPatternElement</text></a></svg></div>

  a:hover text { fill: #0095DD; pointer-events: all;}

Properties

This interface also inherits properties from its parent, SVGElement and implements the ones from SVGFitToViewBox and SVGURIReference.

SVGPatternElement.patternUnits Read only: An SVGAnimatedEnumeration corresponding to the patternUnits attribute of the given <pattern> element. Takes one of the constants defined in SVGUnitTypes.
SVGPatternElement.patternContentUnits Read only: An SVGAnimatedEnumeration corresponding to the patternContentUnits attribute of the given <pattern> element. Takes one of the constants defined in SVGUnitTypes.
SVGPatternElement.patternTransform Read only: An SVGAnimatedTransformList corresponding to the patternTransform attribute of the given <pattern> element.
SVGPatternElement.x Read only: An SVGAnimatedEnumeration corresponding to the x attribute of the given <pattern> element.
SVGPatternElement.y Read only: An SVGAnimatedEnumeration corresponding to the y attribute of the given <pattern> element.
SVGPatternElement.width Read only: An SVGAnimatedEnumeration corresponding to the width attribute of the given <pattern> element.
SVGPatternElement.height Read only: An SVGAnimatedEnumeration corresponding to the height attribute of the given <pattern> element.

Methods

This interface doesn't implement any specific methods, but inherits methods from its parent interface, SVGElement and implements the ones from SVGFitToViewBox and SVGURIReference.

Specifications

Specification	Status	Comment
Scalable Vector Graphics (SVG) 2 The definition of 'SVGPatternElement' in that specification.	Candidate Recommendation	Removed the implemented interfaces `SVGTests`, `SVGLangSpace`, `SVGExternalResourcesRequired`, `SVGStylable`, and `SVGTransformable`.
Scalable Vector Graphics (SVG) 1.1 (Second Edition) The definition of 'SVGPatternElement' in that specification.	Recommendation	Initial definition

Feature	Chrome	Edge	Firefox (Gecko)	Internet Explorer	Opera	Safari (WebKit)
Basic support	?	(Yes)	?	?	?	?

Feature	Android	Edge	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support	No support	(Yes)	?	?	?	?

Document Tags and Contributors

Tags:

Contributors to this page: Sebastianz, mattwojo, fscholz, kscarfone, Sheppy, pa7, Jeremie

Last updated by: Sebastianz, Feb 6, 2017, 5:14:49 AM