用javascript实现模拟火焰_javascript技巧

来源：动视网责编：小采时间：2020-11-27 20:38:05

用javascript实现模拟火焰_javascript技巧

用javascript实现模拟火焰_javascript技巧:不太像，而且比较耗资原，不知道有没有更好的办法=.= 火焰 function PixelAxis(left, bottom, width, height, color) { color = color #000000; var pixels = []; for(var i = 0; i 0xF r.toStr

推荐度：

点击下载本文 文档为doc格式

导读用javascript实现模拟火焰_javascript技巧:不太像，而且比较耗资原，不知道有没有更好的办法=.= 火焰 function PixelAxis(left, bottom, width, height, color) { color = color #000000; var pixels = []; for(var i = 0; i 0xF r.toStr

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

<html> 
<head> 
<title>火焰</title> 
 
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> 
 
 var f = spreadSeeds(60, 120); 
 setInterval("f()",1); 
</ script> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

用javascript实现模拟火焰_javascript技巧

推荐度：

点击下载本文 文档为doc格式

标签：使用火焰实现

热门焦点

用javascript实现模拟火焰_javascript技巧

用javascript实现模拟火焰_javascript技巧

用javascript实现模拟火焰_javascript技巧

最新推荐

猜你喜欢

热门推荐