canvas 制作动效线条背景（可与鼠标交互）

完整代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<canvas id="canvas"></canvas>

<style>
    canvas{
    
    display: block;width: 100%;height: 100%;position:absolute;z-index: -1;}
</style>

<script>
    class Circle {
    
    
        //创建对象
        //以一个圆为对象
        //设置随机的 x，y坐标，r半径，_mx，_my移动的距离
        //this.r是创建圆的半径，参数越大半径越大
        //this._mx,this._my是移动的距离，参数越大移动
        constructor(x, y) {
    
    
            this.x = x;
            this.y = y;
            this.r = Math.random() * 10 ;
            this._mx = Math.random() ;
            this._my = Math.random() ;

        }

        //canvas 画圆和画直线
        //画圆就是正常的用canvas画一个圆