js实现canvas零件人跳舞动画交互效果代码

代码语言:html

所属分类:动画

代码描述:js实现canvas零件人跳舞动画交互效果代码,拖动一个往上抛试试

代码标签: 零件 跳舞 动画 交互 效果

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

<html lang="en"><head>

  <meta charset="UTF-8">

  
  
  
<style>
body, html {
	position: absolute;
	margin: 0;
	padding: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
}

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


</head>

<body>
  <canvas width="971" height="744"></canvas><!-- 
o
 \_/\o
( Oo)                    \|/
(_=-)  .===O-  ~~Z~A~P~~ -O-
/   \_/U'                /|\
||  |_/
\\  |
{K ||
 | PP
 | ||
 (__\\


-->

      <script >
"use strict";
///////////////// worker thread code ///////////////////
const theLastExperience = noWorkers => {
  "use strict";
  // ---- robot structure ----
  const struct = {
    points: [
    {
      x: 0,
      y: -4,
      f(s, d) {
        this.y -= 0.01 * s * ts;
      } },

    {
      x: 0,
      y: -16,
      f(s, d) {
        this.y -= 0.02 * s * d * ts;
      } },

    {
      x: 0,
      y: 12,
      f(s, d) {
        this.y += 0.02 * s * d * ts;
      } },

    { x: -12, y: 0 },
    { x: 12, y: 0 },
    {
      x: -3,
      y: 34,
      f(s, d) {
        if (d > 0) {
          this.x += 0.01 * s * ts;
          this.y -= 0.015 * s * ts;
        } else {
          this.y += 0.02 * s * ts;
        }
      } },

    {
      x: 3,
      y: 34,
      f(s, d) {
        if (d > 0) {
          this.y += 0.02 * s * ts;
        } else {
          this.x -= 0.01 * s * ts;
          this.y -= 0.015 * s * ts;
        }
      } },

    {
      x: -28,
      y: 0,
      f(s, d) {
        this.x += this.vx * 0.025 * ts;
        this.y -= 0.001 * s * ts;
      } },

    {
      x: 28,
      y: 0,
      f(s, d) {
        this.x += this.vx * 0.025 * ts;
        this.y -= 0.001 * s * ts;
      } },

    {
      x: -3,
      y: 64,
      f(s, d) {
        this.y += 0.015 * s * ts;
        if (d > 0) {
          this.y -= 0.01 * s * ts;
        } else {
          this.y += 0.05 * s * ts;
        }
      } },

    {
      x: 3,
      y: 64,
      f(s, d) {
        this.y += 0.015 * s * ts;
        if (d > 0) {
          this.y += 0.05 * s * ts;
        } else {
          this.y -= 0.01 * s * .........完整代码请登录后点击上方下载按钮下载查看

网友评论0