用javascript实现模拟火焰

ttx9n · 发表于 2007-10-3 22:04:52

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

<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需刷新才能执行]

jasonlong · 发表于 2022-11-14 18:23:53

管灌灌灌灌灌灌灌灌灌灌

czoz5y · 发表于 2023-4-7 22:22:34

哟哟哟哟哟以偶

j__j33p · 发表于 2023-5-31 13:36:35

很不错的玩意

.l4 · 发表于 2023-8-22 06:32:04

呵呵呵呵呵呵呵a

mkonji · 发表于 2023-11-2 19:46:32

66666666666

x20yd3qx · 发表于 2023-11-12 20:18:05

hi哦回复iOS就看见

70r45_zs · 发表于 2023-11-13 22:50:31

我找了挺久终于找到了

feiyasqhr · 发表于 2024-3-19 03:31:55

很不错的玩意

JosephSA · 发表于 2024-4-6 22:02:05

来看看！！！

账号		自动登录	找回密码
密码			立即注册

[JavaScript] 用javascript实现模拟火焰

相关帖子