The code consists of 4 main steps: Importing necessary classes, setting up parameters for the displacement map filter, applying the filter, and animating the filter.

Importing necessary classes. The DisplacementMapFilter is the main class used to create the effect. The BitmapData class, and Point class are required to prepare parameters for the displacement map filter.

BitmapData: Object that will be used as the displacement map.Point: Object which contains the offset of the upper-left corner of the target movie clip from the upper-left corner of the map image. componentX: Describes which color channel to use in the map image to displace the x result. componentY: Describes which color channel to use in the map image to displace the y result.

scaleX The strength of the effect in the x plane.scaleY The strength of the effect in the y plane.

Note: Higher numbers mean more displacement.

The displacement map accepts a BitmapData object, NOT a movie clip object as its first parameter. The following piece of code grabs the bitmap information of a movie clip and places it in a BitmapData object.

// Create an empty BitmapData variable with a width and height.
// Notice that we assign the map's width and height to the object's width and height.var mapBitmap:BitmapData = newBitmapData(myMap._width, myMap._height);// Grab bitmap information from the map movie clip.
mapBitmap.draw(myMap);

Note: Look out for a bad draw
This code is for debugging purposes only!! In order to test if you are drawing your bitmap data object correctly. This will give you a visual representation of what you are actually drawing:

//create an empty movie clip named "debugClip"on the next available level
createEmptyMovieClip("debugClip", this.getNextHighestDepth());//attach the bitmap data to the movie clip on the next available level
debugClip.attachBitmap(mapBitmap, this.getNextHighestDepth());

Warning: Make sure you remove this code as it is for de-bugging only!!

In this case, the Point parameter is simple since during the stage and image set up section of this tutorial , all applicable points were set to 0.0.The remaining parameters are straightforward:

At this stage, we now have the filter ready to be applied. In Flash 8 Pro, filters are applied to Movie Clip instances via the filters property of the Movie Clip object. The filters property is an array of all the filters applied to that specific clip. Therefore, in order to see the effect, we must add the DisplacementMapFilter object to a filter list array, then assign the filter list array to the filters property of the target movie clip. All filters are applied in this fashion.

// Create a filter list array. var filterList:Array = new Array();// Add the displacement map filter to the array. filterList.push(filter);// Apply the set of filters to the target movie clip. myTarget.filters = filterList;

Note: If you test your flash file at this point. You should see the filter applied. A nice effect on its own, but let's animate it.

Animation follows the following steps: Change position of the map, change the offset to match the new position, apply the new offset to the filter, and finally, apply the filter to the target clip.

// Creates an animated effect.
// Updates on every frame.onEnterFrame = function () {// This conditional moves the map to the left until it reaches its end. if ((myMap._x+myMap._width)>(Stage.width)) {
myMap._x -= 1.5;
}