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.

PropertyDescription

baseFrequencyX

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

baseFrequencyY

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

height

Gets or sets the height of an element.

numOctaves

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

result

Provides a reference for the output result of a filter.

seed

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

stitchTiles

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

type

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>


 

 

Show:
© 2014 Microsoft