新冠状病毒COVID-19动画演示分离效果

代码语言:html

所属分类:动画

代码描述:新冠状病毒COVID-19动画演示分离效果

代码标签: 冠状 ) 病毒 COVID-19 动画 演示 分离 效果

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

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
body {
  margin: 0;
  overflow: hidden;
  background-color: #141414;
}

.overlay {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 100;
}

body {
  cursor: pointer;
}
</style>

</head>
<body translate="no">
<script>
  window.canvasOptions = {
  	autoClear: true,
  	autoCompensate: false,
  	autoPushPop: true,
  	canvas: true,
  	centered: true,
  	desynchronized: false,
  	width: null,
  	height: null
  };
  const {
	E, LN10, LN2, LOG10E, LOG2E, PI, SQRT1_2, SQRT2,
	abs, acos, acosh, asin, asinh, atan, atan2, atanh, cbrt, ceil, clz32,
	cosh, exp, expm1, floor, fround, hypot, imul, log, log10, log1p, log2, max,
	min, pow, /* random, */ round, sign, sinh, sqrt, tan, tanh, trunc
} = Math;


// Why not?
const ZERO       = 0.0;
const ONE        = 1.0;
const TWO        = 2.0;
const THREE      = 3.0;
const FOUR       = 4.0;
const FIVE       = 5.0;
const SIX        = 6.0;
const SEVEN      = 7.0;
const EIGHT      = 8.0;
const NINE       = 9.0;
const TEN        = 10.0;
const ELEVEN     = 11.0;
const TWELVE     = 12.0;
const SIXTEEN    = 16.0;
const THIRTY     = 30.0;
const THIRTY_TWO = 32.0;
const SIXTY      = 60.0;
const HUNDRED    = 100.0;
const THOUSAND   = 1000.0;

const HALF            = ONE / TWO;
const THIRD           = ONE / THREE;
const TWO_THIRDS      = THIRD * TWO;
const QUARTER         = ONE / FOUR;
const THREE_QUARTER   = QUARTER * THREE;
const FIFTH           = ONE / FIVE;
const SIXTH           = ONE / SIX;
const SEVENTH         = ONE / SEVEN;
const EIGHTH          = ONE / EIGHT;
const TWELFTH         = ONE / TWELVE;
const SIXTEENTH       = ONE / SIXTEEN;
const ONE_THIRTIETH   = ONE / THIRTY;
const THIRTY_SECONDTH = ONE / THIRTY_TWO;
const SIXTIETH        = ONE / SIXTY;

const TENTH              = 1e-1;
const HUNDREDTH          = 1e-2;
const THOUSANDTH         = 1e-3;
const TEN_THOUSANDTH     = 1e-4;
const HUNDRED_THOUSANDTH = 1e-5;
const MILLIONTH          = 1e-6;
const TEN_MILLIONTH      = 1e-7;
const HUNDRED_MILLIONTH  = 1e-8;
const BILLIONTH          = 1e-9;
const TEN_BILLIONTH      = 1e-10;
const HUNDRED_BILLIONTH  = 1e-11;

const HALF_PI             = PI * HALF;
const THIRD_PI            = PI * THIRD;
const THREE_QUARTER_PI    = PI * THREE_QUARTER;
const QUARTER_PI          = PI * QUARTER;
const FIFTH_PI            = PI * FIFTH;
const SIXTH_PI            = PI * SIXTH;
const SEVENTH_PI          = PI * SEVENTH;
const EIGHTH_PI           = PI * EIGHTH;
const TWELFTH_PI          = PI * TWELFTH;
const SIXTEENTH_PI        = PI * SIXTEENTH;
const THIRTY_SECONDTH_PI  = PI * THIRTY_SECONDTH;
const TAU                 = PI * TWO;
const TWO_TAU             = TAU * TWO;
const HALF_TAU            = PI;
const THIRD_TAU           = TAU * THIRD;
const QUARTER_TAU         = HALF_PI;
const FIFTH_TAU           = TAU * FIFTH;
const SIXTH_TAU           = THIRD_PI;
const EIGHTH_TAU          = QUARTER_PI;
const TWELFTH_TAU         = SIXTH_PI;
const SIXTEENTH_TAU       = EIGHTH_PI;
const THIRTY_SECONDTH_TAU = SIXTEENTH_PI;

const SQRT_3              = sqrt(THREE);
const SQRT_4              = sqrt(FOUR);
const SQRT_5              = sqrt(FIVE);

const PHI                 = (1 + sqrt(5)) * 0.5;
const GOLDEN_ANGLE        = 1 / (PHI * PHI);

const COLOR_BLACK         = hsl(0, 0, 0);
const COLOR_WHITE         = hsl(0, 0, 100);
const COLOR_RED           = hsl(0, 100, 50);
const COLOR_ORANGE        = hsl(30, 100, 50);
const COLOR_YELLOW        = hsl(60, 100, 50);
const COLOR_GREEN         = hsl(120, 100, 50);
const COLOR_CYAN          = hsl(180, 100, 50);
const COLOR_BLUE          = hsl(240, 100, 50);
const COLOR_PURPLE        = hsl(280, 100, 50);
const COLOR_MAGENTA       = hsl(300, 100, 50);

const TEXTALIGN_LEFT      = 'left';
const TEXTALIGN_CENTER    = 'center';
const TEXTALIGN_RIGHT     = 'right';
const TEXTBASELINE_TOP    = 'top';
const TEXTBASELINE_MIDDLE = 'middle';
const TEXTBASELINE_BOTTOM = 'bottom';

let _defaulCanvasOptions = {
		autoClear: false,
		autoCompensate: true,
		autoPushPop: false,
		canvas: true,
		centered: false,
		desynchronized: false,
		drawAndStop: false,
		width: null,
		height: null
	};
let _canvasOptions = {};
let canvas = document.getElementById('canvas');
if(canvas === null) {
	canvas = document.createElement('canvas');
	canvas.id = 'canvas';
	document.body.appendChild(canvas);
}
let ctx = canvas.getContext('2d', {
	desynchronized: window.canvasOptions && window.canvasOptions.desynchronized !== undefined ?
		window.canvasOptions.desynchronized : _defaulCanvasOptions.desynchronized
	// preserveDrawingBuffer: true // WebGL
});
const _originalCtx = ctx;
let _anim, _lastC.........完整代码请登录后点击上方下载按钮下载查看

网友评论0