js实现canvas爱心跟随鼠标抖动动画效果代码

代码语言:html

所属分类:粒子

代码描述:js实现canvas爱心跟随鼠标抖动动画效果代码

代码标签: 爱心 跟随 鼠标 抖动 动画 效果

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

<html lang="en">
<head>

   
<meta charset="UTF-8">




   
<style>
        html
, body {
           
background: #000;
       
}

       
* {
           
margin: 0;
           
overflow: hidden;
       
}

       
#canvas {
           
width: 100%;
           
height: 100%;
       
}
   
</style>




</head>

<body>

   
<canvas id="canvas" width="1536" height="294"></canvas>


   
<script>
        let range = n => Array.from(Array(n).keys());

        class Vector {

            constructor(x = 0, y = 0) {
                this.x = x;
                this.y = y;
            }

            reflect() {
                return new Vector(-this.x, -this.y);
            }

            add(vector) {
                return new Vector(this.x + vector.x, this.y + vector.y);
            }

            subtract(vector) {
                return new Vector(this.x - vector.x, this.y - vector.y);
            }

            scale(scalar = 1) {
                return new Vector(this.x * scalar, this.y * scalar);
            }

            length() {
                return Math.sqrt(this.x * this.x + this.y * this.y);
            }

            distance(vector) {
                let dx = this.x - vecto.........完整代码请登录后点击上方下载按钮下载查看

网友评论0