Export (0) Print
Expand All

feTurbulence element | SVGFETurbulenceElement object

Provides a filter to create images based on the Perlin turbulence function.

Scalable Vector Graphics: Filter Effects, Section 15.25.27Internet Explorer 10

 

Syntax


 <feTurbulence type="turbulence" baseFrequency="number" numOctaves="number"/>

DOM Information

Inheritance Hierarchy

 Node
  Element
   SVGElement
     SVGFETurbulenceElement

Members

The SVGFETurbulenceElement object has these types of members:

Properties

The SVGFETurbulenceElement object has these properties.

PropertyAccess typeDescription

baseFrequencyX

Read-only

Provides a base frequency in the X direction for the turbulence calculation.

baseFrequencyY

Read-only

Provides a base frequency in the Y direction for the turbulence calculation.

height

Gets or sets the height of an element.

numOctaves

Read-only

Provides the number of noise functions to be added together when calculating the turbulence.

result

Read-only

Provides a reference for the output result of a filter.

seed

Read-only

Provides a seed for the random number generator used to create the turbulence.

stitchTiles

Read-only

Provides a way to smooth the tiles generated by the turbulence calculation.

type

Read-only

Indicates whether the filter primitive should perform a noise or turbulence function.

width

Defines the width of an element.

x

Gets or sets the x-coordinate value.

y

Gets or sets the y-coordinate value.

 

Standards information

Remarks

Ken Perlin is the author of a set of formulas that provide a way to display turbulence noise. At the time of this writing, an excellent summary is available at http://freespace.virgin.net/hugo.elias/models/m_perlin.htm.

The SVGFETurbulenceElement provides the following properties:

Examples

This example shows a simple turbulence filter with a baseFrequency value of 0.1 and a numOctaves value of 2.

The image will look like this.

feTurbulence element

<!DOCTYPE HTML>
<html>
    
    <head>
    </head>
    
    <body>
        <svg width="400" height="400">
        
            <defs>
               <filter id="MyFilter" filterUnits="userSpaceOnUse" 
                 x="50" y="50"  width="300" height="300">
                  <feTurbulence baseFrequency="0.1"
                    numOctaves="2" />
               </filter>
            </defs>
            <use filter="url(#MyFilter)" x='0' y='0'/>				
            </svg>
    </body>

</html>


See also

Node

 

 

Show:
© 2015 Microsoft