let canvas = document.getElementById("canvas"); let context = canvas.getContext("2d"); let x = 0; let y = 100; let A = 10; //振幅 let w = 0.1; //角速度 let k = 100; function moveSin() { // 清除画布 // context.clearRect(0, 0, canvas.width, canvas.height) // 开始画线 context.beginPath(); context.moveTo(x, y); // 正弦公式:y = Asin(ωx+φ) + k y = A * Math.sin(w * x) + k; x++; context.lineTo(x, y); context.stroke(); // 持续渲染 requestAnimationFrame(moveSin); } moveSin();
<canvas id="canvas" ></canvas>