canvas 绘制函数

以sin 函数为例

y = Asin(Bx+C)+D;

A 表示振幅,A值越大,振幅越大

周期:2Π/B

相移:-(C/B),在B不变的情况下,C为正值时曲线向左移动,C为负值时,曲线向右移动

D:是垂直位移,控制曲线上下移动

核心代码:

for(let x = startX;x<startX+canvasWidth;x+=20/canvasWidth){
   const y = waveHeight*Math.sin((startX+x)*waveWidth+xOffset);
   // points.push([x,canvasHeight/2+y]);
   ctx.lineTo(x,(canvasHeight/2)+y);
}

 

上一篇:vue echart 散点图画矩形区域


下一篇:如何由Height Map生成Normal Map