javascript HTML5的帆布实现七夕情人节三维(三维的缩写)玫瑰花效果代码

本文实例讲述了javascript HTML5的帆布实现七夕情人节三维(三维的缩写)玫瑰花效果。分享给大家供大家参考。具体如下：

下面的玫瑰绘制用到了HTML 5的帆布，所以你的浏览器需要支持HTML 5。个人还是比较推荐铬合金，这个效果在火狐浏览器下也会稍卡。

效果图：

演示地址：http://演示。JB 51。net/js/2015/js-flower-canvas。超文本标记语言

具体代码如下：

！DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01 Transitional//EN ' ' http://www .w3。组织/TR/HTML 4/亏损。' DTD ' HTML标题3d玫瑰花/title元名称='发电机'内容='EditPlus '元名称='作者'内容元名称=“关键词”内容元名称=“描述”内容=' '/标题正文情人节快到了，这里送大家一枝玫瑰，无论是有对象还是没对象的朋友们，情人节快乐~下面的玫瑰绘制用到了HTML 5的帆布，所以你的浏览器需要支持HTML 5。个人还是比较推荐铬合金，这个效果在火狐浏览器下也会稍卡div id=' demo ' style=' width :520；高度：500 px画布id='c '高度='500 '宽度=' 500 '/canvas/div脚本var b=文档。身体；var c=文档。getelementsbytagname(' canvas ')[0]；var a=c . GetContext(' 2d ')；var canvas=文档。getelementsbytagname(' canvas ')[0]；var CTX=画布。get context(' 2d ')；文件。尸体。客户端宽度；其中(m=数学)C=cos，S=sin，P=幂，R=随机；c .宽度=c .高度=f=500h=-250；函数p(a，b，c){ if(c60)返回[S(a*7)*(13 5/(.2 P(b*4，4)))-S(b)*50，b*f 50，625 C(a*7)*(13 5/(.2 P(b*4，4))) b*400，a*1-b/2，a]；a=a * 2-1；b=b * 2-1；if(A*A B*B1) { if(c37) { n=(j=c1)？6:4;o=。5/(a . 01)C(b * 125)* 3-a * 300；w=b * h；返回[o*C(n) w*S(n) j*610-390，o*S(n)-w*C(n) 550-j*350，1180 C(B A)*99-j*300，4-a*.1 P(1-B*B，-h * 6)*。15-A * B *。4 C(A B)/5 P(C((o *(A)1)(B0？w:-w))/25)、30)*.1*(1-B*B))、o/1e 3。7-o * w * 3e-6]} if(c32){ c=c * 1.16-。15;o=a * 45-20；w=b * b * h；z=o * S(C)w * C(C)620；返回[o*C(c)-w*S(c)，28 C(B*.5)*99-b*b*b*60-z/2-h，z，(b*b*.3 P((1-(A*A))，7)*.15 .3)*b，B *]} o=A *(2-B)*(80-C * 2)；w=99-C(A)* 120-C(b)*(-h-C * 4.9)C(P(1-b，7))* 50 C * 2；z=o * S(C)w * C(C)700；返回[o*C(c)-w*S(c)，B*99-C(P(b，7))*50-c/3-z/1.35 450，z，(1-B/1.2)* . 9 a * 1，P((1-b)，20)/4。05]} } var draw=setInterval(' for(I=0；i1e4i )if(s=p(R)，(R()，iF/。74)){ z=s[2]；x=~ ~(s[0]* f/z-h)；y=~ ~(s[1]* f/z-h)；if(！m[q=y*f x]|m[q]z)m[q]=z，a . fill style=' RGB(~(s[3]* h)'，' ~(s[4]*h)'，' ~(s[3]*s[3]*-80)')'，a.fillRect(x，y，1，1)} '，0)；var demo=文档。getelementbyid(' demo ')；函数redraw(){/* var d _ c=document。create element(' canvas ')；d_c.setAttribute('id '，' c ')；d_c.setAttribute('width '，' 520 ')；d_c.setAttribute('高度',' 500 ');演示。append child(d _ c)；*/draw=setInterval(' for(I=0；i1e4i )if(s=p(R)，(R()，iF/。74)){ z=s[2]；x=~ ~(s[0]* f/z-h)；y=~ ~(s[1]* f/z-h)；if(！m[q=y*f x]|m[q]z)m[q]=z，a . fill style=' RGB(~(s[3]* h)'，' ~(s[4]*h)'，' ~(s[3]*s[3]*-80)')'，a.fillRect(x，y，1，1)} '，0)；//alert(d _ c)；}函数clear_canvas() { ctx.clearRect(0，0，520，500)；//画布。父节点。移除子对象(画布)；//删除}函数stop _ draw(obj){ clearInterval(obj)；}/脚本/正文/html希望本文所述对大家的爪哇岛描述语言程序设计有所帮助。