SVGFEImageElement: x property
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
The x
read-only property of the SVGFEImageElement
interface describes the horizontal coordinate of the position of an SVG filter primitive as a SVGAnimatedLength
.
It reflects the x
attribute of the <feImage>
element, which fetches image data from an external source and provides the pixel data as output. The attribute is a <length>
or <percentage>
. The <coordinate>
is a length in the user coordinate system that is the given distance from the origin of the user coordinate system along the x-axis. If the x
attribute is a percent value, the property value is relative to the width of the filter region in user coordinate system units. The default value is 0
.
Value
Example
const feImage = document.querySelector("feImage");
const leftPosition = feImage.x;
console.log(leftPosition.baseVal.value); // the `x` value
Specifications
Specification |
---|
Filter Effects Module Level 1 # dom-svgfilterprimitivestandardattributes-x |
Browser compatibility
BCD tables only load in the browser
See also
SVGFEImageElement.y
- SVG tutorial: Filter effects
- SVG Filter primitive attributes
- CSS
<blend-mode>
data type - CSS
mix-blend-mode
property