The Image Morphing Applet




This is an implementation of a peculiar triangular morphing algorithm. Starting with a source image, a destination image, and three control points for each image, I basically divide each image into a mesh of triangles, using the four corners and three control points as vertices. These triangles are then split into what I call simple triangles, which are triangles with one horizontal edge. This results in 14 triangles for each image. I then interpolate between each source/destination triangle pair to generate each frame of the morph; I do a triangular scanline conversion into the intermediate frame triangle, using the source and destination triangles as color sources and the frame number (as a fraction of the total number of frames) as an alpha transparency value for the sources. It's not very fast, and not very robust, but with carefully selected images and control points it seems to work reasonably. Notice that the degree of morphing (the degree of pixel tranformation and motion versus pure transparent fade and replacement) is highest near the control points (which in this case are the eyes and nose of the people in the images), dropping to zero at the edges of the image.

The original source code for the Image Morphing Applet (from 1996, written for Java 1.0.2) can be found here.

I would appreciate your comments.

Using the Image Morphing Applet


Parameters
imagesrcThe source image
imagedstThe destination image
framecntThe number of intermediate frames to generate
intervalThe animation frame rate interval in milliseconds
cpt1The first control point pair, in the following format: srcX:srcY:dstX:dstY
cpt2The second control point pair, in the following format: srcX:srcY:dstX:dstY
cpt3The third control point pair, in the following format: srcX:srcY:dstX:dstY
audioAn optional audio file to play (.au format)

Suggestions