大鱼吃小鱼游戏-dust.js

最新推荐文章于 2021-10-06 18:22:28 发布

thu_dza

最新推荐文章于 2021-10-06 18:22:28 发布

阅读量708

点赞数

CC 4.0 BY-SA版权

分类专栏： h5 文章标签：游戏 h5

本文链接：https://blog.youkuaiyun.com/thu_dza/article/details/50117681

h5 专栏收录该内容

11 篇文章

订阅专栏

本文介绍了一种在画布上实现随机分布漂浮物的方法。通过定义`dustObj`类来创建多个漂浮物实例，每个漂浮物的位置、幅度随机初始化，并通过三角函数模拟漂浮效果。该方法适用于模拟海面漂浮物等场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

//类是背景画布上随机分布漂移物
var dustObj = function()
{
    this.x = [];
    this.y = [];
    this.amp = [];  //漂浮物随海水漂移的幅度
    this.NO = [];   //用于选择哪个漂浮物

    this.alpha;     //漂浮物三角函数角度，用于计算漂浮物漂浮大小

}

dustObj.prototype.num = 30;//定义三十个漂浮物，太多会影响cpu效率
dustObj.prototype.init = function()
{
    for(var i = 0; i < this.num; i++)
    {
        this.x[i] = Math.random() * canWidth;
        this.y[i] = Math.random() * canHeight;
        this.amp[i] = 20 + Math.random() * 25;
        this.NO[i] = Math.floor(Math.random() * 7);//归一[0,7)，用于随机选择漂浮物图片
    }
    this.alpha = 0;
}
dustObj.prototype.draw = function()
{
    this.alpha += deltaTime *0.0005; //
    var l = Math.sin(this.alpha);
    for(var i = 0; i < this.num; i++)
    {
        var no = this.NO[i];
        ctx1.drawImage(dustPic[no], this.x[i] + this.amp[i] * l, this.y[i]);
    }
}