用javascript实现模拟火焰

不太像，而且比较耗资原，不知道有没有更好的办法=.=

<html> <head> <title>火焰</title> <script language="JavaScript"> function PixelAxis(left, bottom, width, height, color) {     color = color || "#000000";     var pixels = [];     for(var i = 0; i <= width; i++)     {         pixels[i] = [];         for(var j = 0; j<=height; j++)         {             var img = new Image(1, 1);             img.style.backgroundColor = color;             img.style.position = "absolute";             img.style.left = left + i;             img.style.top = bottom - j;             pixels[i][j] = img;             document.body.appendChild(img);         }     }     return function(x, y, color)     {         pixels[x][y].style.backgroundColor = color;     } } function color(r, g ,b) {     r = r > 0xF ? r.toString(16) : "0" + r.toString(16);     g = g > 0xF ? g.toString(16) : "0" + g.toString(16);     b = b > 0xF ? b.toString(16) : "0" + b.toString(16);     return "#"+r+g+b; } function fireColor(seed) {     return color(seed, Math.floor(0.5*seed), 0); } function spreadSeeds(width, height) {     var pixel = PixelAxis(200, 200, width, height);     var fc = [];     fc[0] = [];     return function()     {         for(var i = 0; i <= width; i++)         {             var s = Math.floor(255 * Math.random());             fc[0][i] = s;             pixel(i, 0, fireColor(s));         }         for(var i = 1; i < height; i++)         {             fc[i] = [];             for(var j = 0; j <= width; j++)             {                 var a = j > 0 ? fc[i-1][j-1] : 0;                 var b = fc[i-1][j];                 var c = j < width ? fc[i-1][j+1] : 0;                 var s = Math.floor((a+b+c)/3);                 //alert(c);                 fc[i][j] = s;                 s = s-Math.floor(i/height*255);                  s = s > 0 ? s : 0;                 pixel(j, i, fireColor(s));             }         }     } } </script> </head> <body bgcolor="#000000"> </body> <script>     var f = spreadSeeds(60, 120);     setInterval("f()",1); </script> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

频道导航

用javascript实现模拟火焰

您可能感兴趣的文章: