阳春三月,草长莺飞。今天下午,百年珞珈、纯美樱花,我们线上赏樱花!
效果图:(动态生成樱花)
实现代码(Python):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 | import turtle as T import random import time # 画樱花的躯干(60,t) def Tree(branch, t): time.sleep(0.0005) if branch > 3: if 8 <= branch <= 12: if random.randint(0, 2) == 0: t.color('snow') # 白 else: t.color('lightcoral') # 淡珊瑚色 t.pensize(branch / 3) elif branch < 8: if random.randint(0, 1) == 0: t.color('snow') else: t.color('lightcoral') # 淡珊瑚色 t.pensize(branch / 2) else: t.color('sienna') # 赭(zhě)色 t.pensize(branch / 10) # 6 t.forward(branch) a = 1.5 * random.random() t.right(20 * a) b = 1.5 * random.random() Tree(branch - 10 * b, t) t.left(40 * a) Tree(branch - 10 * b, t) t.right(20 * a) t.up() t.backward(branch) t.down() # 掉落的花瓣 def Petal(m, t): for i in range(m): a = 200 - 400 * random.random() b = 10 - 20 * random.random() t.up() t.forward(b) t.left(90) t.forward(a) t.down() t.color('lightcoral') # 淡珊瑚色 t.circle(1) t.up() t.backward(a) t.right(90) t.backward(b) # 绘图区域 t = T.Turtle() # 画布大小 w = T.Screen() t.hideturtle() # 隐藏画笔 t.getscreen().tracer(5, 0) w.screensize(bg='wheat') # wheat小麦 t.left(90) t.up() t.backward(150) t.down() t.color('sienna') # 画樱花的躯干 Tree(60, t) # 掉落的花瓣 Petal(200, t) w.exitonclick() |
网页樱花树(动态效果):
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 | <!doctype html> <html> <head> <meta http-equiv="Pragma" content="no-cache" /> <meta http-equiv="Cache-Control" content="no-cache" /> <meta http-equiv="Expires" content="0" /> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no" /> <style type="text/css"> canvas{ position: absolute; left: 0; top: 0; } </style> </head> <body bgcolor="#000000"> <canvas id="tree"></canvas> <canvas id="flower"></canvas> <script> //两个canvas var tree = document.getElementById("tree"); tree.width = window.innerWidth; tree.height = window.innerHeight ; var tCxt = tree.getContext("2d"); var flower = document.getElementById("flower"); flower.width = window.innerWidth; flower.height = window.innerHeight ; var cxt = flower.getContext("2d"); var flowerList = [];//樱花列表 var rootTop = 450 ;//树起点 var flowerColor = "rgba(255,192,203,.3)" ;//花色 var flowerColorDeep = "rgba(241,158,194,.5)" ;//花色深 var treeColor2 = "rgba(255,192,203,.5)" ;//树枝颜色 var treeColor = "#FFF" ;//树干颜色 var fallList = [];//飘落樱花列表 var g = 0.01 ;//重力加速度 var gWind = 0.005;//风力加速度 var limitSpeedY = 1;//速度上限 var limitSpeedX = 1 ;//速度上限 cxt.shadowColor= "#FFF" ; cxt.shadowBlur = 10 ; function drawTree(x,y,deg,step,type){ var deg1 = step%2 == 0 ? 0.1 : -0.1 ; var x1 = x + Math.cos(deg+deg1) * (step+4) * 0.8 ;//以步长来判断枝干长度 x轴偏移大一些 var y1 = y + Math.sin(deg+deg1) * (step-1) * 0.8 ;//以步长来判断枝干长度 Y轴压缩一些 tCxt.beginPath(); tCxt.lineWidth = step/3; tCxt.moveTo(x,y); tCxt.lineTo(x1,y1); tCxt.strokeStyle = (step > 5 ) ? treeColor : treeColor2 ;//细纸条都换成花的颜色 tCxt.stroke(); if(step > 20){//树干相交的位置有间隙,以一个圆填充 tCxt.fillStyle = treeColor ; tCxt.arc(x,y,step/6,0,Math.PI*2); tCxt.fill(); } if(step < 3 || (step < 23 && Math.random() > 0.1)){ //末梢位置 画花瓣 var color = [flowerColorDeep,flowerColor,flowerColor][Math.round(Math.random()+0.2)] ; var r = 2+Math.random()*2 tCxt.fillStyle = color ; tCxt.arc(x1+Math.random()*3,y1+Math.random()*3,r,0,Math.PI) tCxt.fill(); flowerList.push({x:x,y:y,sx:(Math.random()-0.5),sy:0,color:color,r:r,deg:deg});//保存下画樱花的位置 } step -- ; if(step > 0){ drawTree(x1,y1,deg,step,type); if(step%3 == 1 && step > 0 && step < 30) drawTree(x1,y1,deg+0.2 + 0.3 * Math.random(),Math.round(step/1.13));//右分叉 if(step%3 == 0 && step > 0 && step < 30) drawTree(x1,y1,deg-0.2 - 0.3 * Math.random(),Math.round(step/1.13));//左分叉 } } drawTree(tree.width/2,rootTop,-Math.PI/2,30,1);//执行 var len = flowerList.length ; function step(){ if(Math.random() > 0.3) fallList.push(flowerList[Math.floor(Math.random()*len)]);//随机取出一个,花瓣复制到飘落花瓣的列表中 cxt.clearRect(0,0,tree.width,tree.height); for(var i = 0 ;i < fallList.length ; i ++){ if(fallList[i].sy < limitSpeedY) fallList[i].sy += g ; fallList[i].sx += gWind ; fallList[i].x += fallList[i].sx ; fallList[i].y += fallList[i].sy ; if(fallList[i].y > rootTop+30){//飘到树根+30的花瓣移除 fallList.splice(i,1); i -- ; continue ; } cxt.beginPath(); cxt.fillStyle = fallList[i].color ; fallList[i].deg += fallList[i].sx*0.05 ;//跟速度相关的旋转花瓣 cxt.arc(fallList[i].x,fallList[i].y,fallList[i].r,fallList[i].deg,fallList[i].deg+Math.PI*1.3); cxt.fill(); } requestAnimationFrame(step); } requestAnimationFrame(step); </script> </body> </html> |
行云博客 - 免责申明
本站提供的一切软件、教程和内容信息仅限用于学习和研究目的;不得将上述内容用于商业或者非法用途,否则,一切后果请用户自负。本站信息来自网络,版权争议与本站无关。您必须在下载后的24个小时之内,从您的电脑或手机中彻底删除上述内容。如果您喜欢该程序,请支持正版,购买注册,得到更好的正版服务。如有侵权请邮件与我(admin@xy586.top)联系处理。敬请谅解!
本文链接:https://www.xy586.top/619.html
转载请注明文章来源:行云博客 » 武汉的樱花开了!出不了门别担心,线上带你”开”樱花![Python画樱花]