Menu Home

feDisplacementMap

osbo.com | SVG | Elements | feDisplacementMap

The feDisplacementMap SVG element specifies the pixels values from the image from in2 to spatially displace the image from in.

P'(x,y) ← P( x + scale * (XC(x,y) - 0.5), y + scale * (YC(x,y) - 0.5))

P(x,y) is the input image, in, and P'(x,y) is the destination. XC(x,y) and YC(x,y) are the component values of the channel designated by the xChannelSelector and yChannelSelector.

Syntax

Attributes

in

Specifies the input for the filter primitive.

If no value is provided and this is the first filter primitive, then this filter primitive will use SourceGraphic as its input. If no value is provided and this is a subsequent filter primitive, then this filter primitive will use the result from the previous filter primitive as its input.

Value
SourceGraphic | SourceAlpha | BackgroundImage | BackgroundAlpha | FillPaint | StrokePaint | <filter-primitive-reference>
Default
SourceGraphic (or result)

in2

Specifies the second input image to the compositing operation.

If no value is provided and this is the first filter primitive, then this filter primitive will use SourceGraphic as its input. If no value is provided and this is a subsequent filter primitive, then this filter primitive will use the result from the previous filter primitive as its input.

Value
SourceGraphic | SourceAlpha | BackgroundImage | BackgroundAlpha | FillPaint | StrokePaint | <filter-primitive-reference>
Default
SourceGraphic (or result)

scale

Specifies the displacement scale factor.

Value
<number>
Default
0

xChannelSelector

Specifies which channel from in2 to use to displace the pixels in in along the x-axis.

Value
R | G | B | A
Default
A

yChannelSelector

Specifies which channel from in2 to use to displace the pixels in in along the y-axis.

Value
R | G | B | A
Default
A

Examples

in

BackgroundAlpha

BackgroundImage

FillPaint

<filter-primitive-reference>

SourceAlpha

SourceGraphic

StrokePaint

in2

BackgroundAlpha

BackgroundImage

FillPaint

<filter-primitive-reference>

SourceAlpha

SourceGraphic

StrokePaint

scale

<number>

xChannelSelector

A

B

G

R

yChannelSelector

A

B

G

R

Internal

feBlend

feColorMatrix

feComponentTransfer

feComposite

feConvolveMatrix

feDiffuseLighting

feDistantLight

feDropShadow

feFlood

feFuncA

feFuncB

feFuncG

feFuncR

feGaussianBlur

feImage

feMerge

feMergeMode

feMorphology

feOffset

fePointLight

feSpecularLighting

feSpotLight

feTile

feTurbulence

filter

External

World Wide Web Consortium (W3C)