用javascript实现模拟火焰- Javascript - 软晨网（RuanChen.com）

当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 用javascript实现模拟火焰

技术文章搜索

关键字

Javascript 中的用javascript实现模拟火焰

出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 99 ::

收藏到网摘: n/a

JavaScript 入门·JavaScript 具有全范围的运算符 JavaScript加密解密7种方法总结分析

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

点击运行可以看到效果:

<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 全选提示:你可先修改部分代码,再按运行]

JavaScript 入门·JavaScript 具有全范围的运算符 JavaScript加密解密7种方法总结分析

Javascript 中的 用javascript实现模拟火焰

评论 (0) All

Javascript 中的用javascript实现模拟火焰