canvas点对点连线传送信息并计算数量动画效果代码
代码语言:html
所属分类:动画
代码描述:canvas点对点连线传送信息并计算数量动画效果代码
代码标签: 点 连线 传送 信息 并 计算 数量 动画 效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!doctype html> <html> <head> <meta charset="utf-8"> <style> *{margin:0;padding:0;} canvas { background:#111; background-size:cover; display:block; } body{overflow: hidden;} </style> </head> <body> <div></div> <script> // queue to land // number of docked or approaching planes // change color of plane for modes // make planes avoid planes // adjustable settings // add random wind factors window.requestAnimFrame=function(){return window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||function(a){window.setTimeout(a,1E3/60)}}(); $ = {}; $.util = { rand: function( min, max ) { return Math.random() * ( max - min ) + min; }, randInt: function( min, max ) { return Math.floor( Math.random() * ( max - min + 1 ) ) + min; }, norm: function( val, min, max ) { return ( val - min ) / ( max - min ); }, lerp: function( norm, min, max ) { return ( max - min ) * norm + min; }, map: function( val, sMin, sMax, dMin, dMax ) { return $.util.lerp( $.util.norm( val, sMin, sMax), dMin, dMax ); }, clamp: function( val, min, max ) { return Math.min( Math.max( val, Math.min( min, max ) ), Math.max( min, max ) ); }, distance: function( p1, p2 ) { var dx = p1.x - p2.x, dy = p1.y - p2.y; return Math.sqrt( dx * dx + dy * dy ); }, angle: function( p1, p2 ) { return Math.atan2( p1.y - p2.y, p1.x - p2.x ); }, inRange: function( val, min, max ) { return val >= Math.min( min, max ) && val <= Math.max( min, max );.........完整代码请登录后点击上方下载按钮下载查看
网友评论0