VOOZH about

URL: https://www.geeksforgeeks.org/html/svg-feimage-element/

⇱ SVG <feImage> Element - GeeksforGeeks


  • Courses
  • Tutorials
  • Interview Prep

SVG <feImage> Element

Last Updated : 31 Mar, 2022

SVG stands for Scalable Vector Graphic. It can be used to make graphics and animations like in HTML canvas. The <feImage> SVG filter primitive fetches image data from an external source and provides the pixel data as output.

Syntax:

<feImage x="" y="" width="" height="" externalResourcesRequired ="" 
preserveAspectRatio="" xlink:href=""/>

Attributes:

  • x: It defines the x-axis coordinate in the user coordinate system.
  • y: It defines the y-axis coordinate in the user coordinate system.
  • width: The width of the foreignObject.
  • height: The height of the foreignObject.
  • externalResourcesRequired: It indicates whether the external resources are required in the current document. Default value is false.
  • preserveAspectRatio: It indicates how an element with a viewBox providing a given aspect ratio must fit into a viewport with a different aspect ratio.
  • xlink:href: It defines a reference to a resource as a reference IRI.
  • crossorigin: It tells the request of the browser for an image file with cross-origin permissions.

Example 1:

Output:

👁 Image

Example 2:

Output:

👁 Image

Example 3:

Output:

👁 Image
Comment
Article Tags: