canvas按住键盘左右键森林奔跑视觉差异效果代码
代码语言:html
所属分类:视觉差异
代码描述:canvas按住键盘左右键森林奔跑视觉差异效果代码,按住鼠标左右键看看效果。
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { overflow: hidden; } .message { position: absolute; background: black; color: white; bottom: 50px; left: 50px; padding: .5rem 1rem; } </style> </head> <body> <canvas id="relics-canvas"></canvas> <div class="message"> Use arrow keys to move. </div> <script > !function () { let canvas = document.getElementById('relics-canvas'); let context = canvas.getContext('2d'); let width = canvas.width = window.innerWidth; let height = canvas.height = window.innerHeight; let trees = []; let numTrees = 100; let fl = 250; let vpX = canvas.width / 2; let vpY = canvas.height / 2; let floor = 50; let ax = 0; let ay = 0; let az = 0; let vx = 0; let vy = 0; let vz = 0; let gravity = 0.3; let friction = 0.95; function Tree() { this.x = 0; this.y = 0; this.xpos = 0; this.ypos = 0; this.zpos = 0; this.scaleX = 1; this.scaleY = 1; this.color = "#ffffff"; this.alpha = 1; this.lineWidth = Math.random() * 4 + 1; this.branch = []; //generate some random branch positions this.branch[0] = -140 - Math.random() * 20; this.branch[1] =.........完整代码请登录后点击上方下载按钮下载查看
网友评论0