canvas泰森多边形动画效果
代码语言:html
所属分类:背景
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
html,
body {
width: 100%;
height: 100%;
overflow: hidden;
}
body {
margin: 0;
padding: 0;
color: #fff;
background-color: #000;
}
canvas {
-webkit-tap-highlight-color: transparent;
tap-highlight-color: transparent;
-webkit-user-select: none;
user-select: none;
cursor: pointer;
}
</style>
</head>
<body translate="no">
<canvas></canvas>
<script >
// Voronoi by @neave
window.requestAnimationFrame =
window.requestAnimationFrame ||
window.webkitRequestAnimationFrame ||
window.mozRequestAnimationFrame ||
window.msRequestAnimationFrame ||
function (callback) {
setTimeout(callback, 1000 / 60);
};
Array.prototype.each = function (f) {
var i = this.length;
while (i--) {
f(this[i]);
}
};
function Edge() {
this.data = undefined;
this.next = undefined;
this.rot = undefined;
}
Edge.prototype.splice = function (e) {
var e1 = this.next.rot,
e2 = e.next.rot,
e3 = this.next;
this.next = e.next;
e.next = e3;
e3 = e1.next;
e1.next = e2.next;
e2.next = e3;
};
Edge.prototype.swap = function () {
var e0 = this.oPrev(),
e1 = this.sym().oPrev();
this.splice(e0);
this.sym().splice(e1);
this.splice(e0.lNext());
this.sym().splice(e1.lNext());
this.setOrg(e0.dest());
this.setDest(e1.dest());
};
Edge.prototype.sym = function () {
return this.rot.rot;
};
Edge.prototype.iRot = function () {
return this.rot.rot.rot;
};
Edge.prototype.org = function (v) {
return this.data;
};
Edge.prototype.setOrg = function (v) {
this.data = v;
};
Edge.prototype.dest = function () {
return this.rot.rot.data;
};
Edge.prototype.setDest = function (v) {
this.rot.rot.data = v;
};
Edge.prototype.setOrgDest = function (o, d) {
this.setOrg(o);
this.setDest(d);
};
Edge.prototype.left = function () {
return this.rot.rot.rot.data;
};
Edge.prototype.setLeft = function (v) {
this.rot.rot.rot.data = v;
};
Edge.prototype.right = function () {
return this.rot.data;
};
Edge.prototype.setRight = function (v) {
this.rot.data = v;
};
Edge.pr.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0