canvas实现有形状的perlin噪波纹理动画效果代码
代码语言:html
所属分类:动画
代码描述:canvas实现有形状的perlin噪波纹理动画效果代码
代码标签: canvas 形状 perlin 噪波 纹理 动画
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<style>
*{
padding:0;
margin:0;
boz-sizing:border-box;
}
#canvas{
background:#021636;
}
</style>
</head>
<body>
<canvas id="canvas"></canvas>
<script>
/*
* A speed-improved perlin and simplex noise algorithms for 2D.
*
* Based on example code by Stefan Gustavson (stegu@itn.liu.se).
* Optimisations by Peter Eastman (peastman@drizzle.stanford.edu).
* Better rank ordering method by Stefan Gustavson in 2012.
* Converted to Javascript by Joseph Gentle.
*
* Version 2012-03-09
*
* This code was placed in the public domain by its original author,
* Stefan Gustavson. You may use it as you see fit, but
* attribution is appreciated.
*
*/
(function (global) {
var module = global.noise = {};
function Grad(x, y, z) {
this.x = x;this.y = y;this.z = z;
}
Grad.prototype.dot2 = function (x, y) {
return this.x * x + this.y * y;
};
Grad.prototype.dot3 = function (x, y, z) {
return this.x * x + this.y * y + this.z * z;
};
var grad3 = [new Grad(1, 1, 0), new Grad(-1, 1, 0), new Grad(1, -1, 0), new G.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0