True Phong Shading in Flash 9

Jan Kalis — Wed, 18 Nov 2009 22:56:38 +0000

Most (Flash) 3D engines use a clever technique called normal mapping to compensate for the lack of mesh detail. How could a normal map be used for Phong shading (specifically highlights)? The formula for highlights is (L . N) ^ s, where L is the vector towards the light, N is the normal and s is the shininess exponent. We can easily calculate L .N using ColorMatrixFilter. But what do we do about the exponent? My solution follows:

I recently noticed this little function in the BitmapData class.

public function paletteMap (sourceBitmapData:BitmapData, sourceRect:Rectangle, destPoint:Point, redArray:Array = null, greenArray:Array = null, blueArray:Array = null, alphaArray:Array = null):void

What if I just remapped a linear gradient to an “exponential” gradient and use normal mapping with this new palette? That is:

var shininess:Number = 50;

for (var j:int = 0; j < 256; j++)
{
	var alpha:Number = j / 255;
	newPalette[j] = Math.floor(Math.pow(alpha, shininess) * 255);
}

Here’s the result (use mouse to rotate the cherry). It’s using a combination of threshold and GlowFilter to simulate light bloom.

GLOW interactive™ BLOG » Palette-Remapping

True Phong Shading in Flash 9