这里使用js绘制生成花瓣效果,纯js生成的图形绘制效果,想研究一下javascript图形绘画方面知识的,不妨参考一下这个小程序,我觉得还是挺不错的。
运行效果如下图所示:
具体代码如下:
<html > <head> <meta http-equiv="content-type" content="text/html; charset=gb2312" /> <title>js绘制生成花瓣效果</title> </head> <body> <script language="javascript"> function a(x,y,color) {document.write("<img border="0" style="position: absolute; left: "+(x+300)+"; top: "+(y+200)+";background-color: "+color+"" src="px.gif" width=1 height=1>")} </script> <script> for(t=1;t<=360;t++){ lo=200 * math.sin(2 * (math.pi / 180) * t); x = lo * math.cos((math.pi / 180) * t); y = lo * math.sin((math.pi / 180) * t); a(x,y,"#000000"); lo=200 * math.cos(2 * (math.pi / 180) * t); x = lo * math.cos((math.pi / 180) * t); y = lo * math.sin((math.pi / 180) * t); a(x,y,"#ff0000"); } </script> </body> </html>
希望本文所述对大家的javascript程序设计有所帮助。
以上就是js实现花瓣效果代码展示的详细内容。
