canvas变换曲线效果代码

代码语言:html

所属分类:其他

代码描述:canvas变换曲线效果代码,点击可切换。

代码标签: canvas 变换 曲线

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en" >
<head>
  <meta charset="UTF-8">
<style>
    body,
html {
	position: absolute;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	touch-action: none;
	content-zooming: none;
	background: #000;
}

canvas {
	position: absolute;
	width: 100%;
	height: 100%;
	user-select: none;
	background: #000;
	cursor: pointer;
}
</style>

</head>
<body>
<!-- partial:index.partial.html -->
<canvas></canvas>
<!-- partial -->
  <script  >
      // Ported from an ActionScript by Keith Peters
// http://www.bit-101.com/content/040403.swf
"use strict";
const canvas = document.querySelector("canvas");
const ctx = canvas.getContext("2d");
const doit = () => {
	canvas.width = canvas.offsetWidth;
	canvas.height = canvas.offsetHeight;
	const cx = canvas.offsetWidth / 2;
	const cy = canvas.offsetHeight / 2;
	let ra = Math.random() * Math.PI * 2;
	let ga = ra + 0.4;
	let ba = ra + 0.8;
	const cs = 0.01 + Math.random() * 0.05;
	const numPoints = Math.round(10 + Math.random() * 50);
	const dist = 2 * Math.PI / (numPoints - 1);
	const noise = Math.random() * 100 + 70;
	const noise2 = Math.random() * 4 + 2;
	const points .........完整代码请登录后点击上方下载按钮下载查看

网友评论0