主要介绍了canvas三角函数模拟水波效果的示例代码,小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧

最近项目中，ui设计了个水波效果的背景动画，然而并没有gif或svg动画，开始试着用css实现了一下，动画效果并不是很好，网上查了下基本都是用贝赛尔曲线实现，想起以看的各种前波形图，于是想着用三角函数图像初略模拟一下 一、绘制sin函数图像 sin函数表达式如下， y=Asin（wx+φ）+h 其中 A表示振幅，ω表示角频率（ω=2π/T,T为函数的周期），φ表示初相，h表示图像向y轴正方向平移的长度 ；（这里需要注意一下：h在数学学的本来是表示向上平移的，但在canvas中采用的是屏幕坐标系，