canvas实现环形叠加阴影动画效果代码

代码语言:html

所属分类:动画

代码描述:canvas实现环形叠加阴影动画效果代码

代码标签: canvas 环形 叠加 阴影 动画

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

<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  


  

  
  
</head>

<body translate="no">
  
  
      <script >
// speed-coded re-code of experiment from 2003

const canvas = document.createElement('canvas');
const c = canvas.getContext('2d');

document.body.append(canvas);

let lastRand = Math.random();

function zrand() {
  if (Math.random() < .8) return lastRand;

  lastRand = Math.random();
  return lastRand;
}

let mx = 0;
let my = 0;
onpointermove = e => {
  mx = e.clientX;
  my = e.clientY;
};

let hw;
let hh;

function resize() {

  w = innerWidth * 2;
  h = innerHeight * 2;
  hw = w / 2;
  hh = h / 2;
  canvas.width = w;
  canvas.height = h;
  canvas.style.width = innerWidth + 'px';
}
resize();

const S = 4;

function sprite(p) {
  p = Object.assign({
    x: 0,
    y: 0,
    rotation: 0,
    scaleX: 1,
    scaleY: 1,
    fill: 'gray',
    stroke: 'black',
    width: 100,
    height: 100,
 .........完整代码请登录后点击上方下载按钮下载查看

网友评论0