Т.к. фильтр не имеет методов для измения направления луча света для направленных (конических) источников, то приходится постоянно обновлять сцену. Для этого каждый раз для сцены удаляются все источники света (метод clear()) и добавляются новые с новыми параметрами направленности лучей. Это создает впечатление системы прожекторов, освещающих сцену.
Код этого примера приведен ниже. Вы можете также просмотреть его, выбрав пункт меню View/Source или щелкнув правой клавишей и выбрав пункт View Source из выпавшего меню.
<html>
<body>
<script language="javascript">
window.onload=Init;
var x0, y0, rx, ry, w, h;
var fasa = 0;
var dfasa = 15;
var s = 7;
var intens = 50;
var z = 300;
var fi = new Array(6);
var xy = new Array(new Array(2),
new Array(2),
new Array(2),
new Array(2),
new Array(2),
new Array(2));
var rgb = new Array(new Array( 0, 0, 255),
new Array(255, 0, 0),
new Array(255, 0, 255),
new Array( 0, 255, 0),
new Array(255, 255, 0),
new Array( 0, 255, 255));
var x,y;
function GetXY(angle){
x = rx*Math.cos(angle)+x0;
y = ry*Math.sin(angle*2)+y0
}
function MoveLights(fs){
var fltr = obj.filters.light;
//удаляем все источники света
fltr.clear();
//добавляем рассеянный свет, чтобы было не так темно
fltr.addAmbient(255, 255, 255, 50);
fsrad=fs*Math.PI/180;
//добавляем конические источники с новыми параметрами
for (var i=0; i<6; i++){
GetXY(fi[i]+fsrad);
fltr.addCone(xy[i][0], xy[i][1], z, x, y,
rgb[i][0], rgb[i][1], rgb[i][2], intens, s);
}
}
function next(){
for (var i=0; i<6; i++)
MoveLights(fasa);
fasa+=dfasa;
if (fasa> 360) fasa-=360;
}
function Init(){
w=obj.style.pixelWidth;
h=obj.style.pixelHeight;
x0 = w/2;
y0 = h/2;
rx = 3*x0/4;
ry = 3*y0/4;
for (var i=0; i<6; i++)
fi[i] = i*60.0*Math.PI/180.0;
xy[0][0]=0; xy[0][1]=0;
xy[1][0]=w; xy[1][1]=0;
xy[2][0]=0; xy[2][1]=y0;
xy[3][0]=w; xy[3][1]=y0;
xy[4][0]=0; xy[4][1]=h;
xy[5][0]=w; xy[5][1]=h;
timer=setInterval("next()",200);
}
</script>
<div id=obj style="float:left; overflow:hidden; width:300; height:300; filter:light();">
<span style="width:300; height:300; background-color:blue; color:yellow; font-size:16pt; text-align:center;">
<b>Пример демонстрации фильтра light().<br>
</b></span>
</div>
</pre>
</body>
</html>