js实现canvas重力钟摆摆动弧线动画效果代码-html代码-BFW代码库

js实现canvas重力钟摆摆动弧线动画效果代码

代码语言：html

所属分类：动画

代码描述：js实现canvas重力钟摆摆动弧线动画效果代码

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

<html>

<head>
    <style>
        html {
        	height: 100%;
        }
        body {
        	background-color: #424242;
        	width: 100%;
        	height: 100%;
        	margin: 0px;
        	font-family: Arial;
        	overflow: hidden;
        }
    </style>

</head>

<body><canvas id="chaosPendulum"></canvas>
    <script>
        class Pendulum {
        	constructor(l1, l2, m1, m2, g) {
        		this.g = g;
        
        		this.l1 = l1;
        		this.l2 = l2;
        
        		this.m1 = m1;
        		this.m2 = m2;
        
        		this.a1 = Math.PI;
        		this.a2 = Math.PI / 8;
        
        		this.a1_v = 0;
        		this.a2_v = 0;
        	}
        
        	tick() {
        		this.a1_v += this.calcA1();
        		this.a2_v += this.calcA2();
        
        		this.a1 += this.a1_v;
        		this.a2 += this.a2_v;
        	}
        
        	calcA1() {
        		let num1 = -this.g * (2 * this.m1 + this.m2) * Math.sin(this.a1);
        		let num2 = -this.m2 * this.g * Math.sin(this.a1 - .........完整代码请登录后点击上方下载按钮下载查看