Javascript 使用画布的图像之字形运动

我是JS和canvas的新手，我正在尝试进行一些练习。我正在尝试创建一个垂直射击游戏，我希望敌人不仅以线性方式移动，而且上下移动（之字形）。到目前为止，我只能对线性运动进行编码，但无法对振荡运动进行编码。以下是我到目前为止编写的代码（请检查drawDucks函数）：

var c=新对象（）；
var ctx=新对象（）；
bg=新图像（）；
bg.src=“bg.jpg”；
坦克=新图像（）；
tank.src=“tank1.png”；
duck=新图像（）；
duck.src=“duck_1.png”；
游戏画布=
{       
坦克位置：221.5，
左:0,，
达克托普：30，
getCanvas:函数（id）
{
c=document.getElementById（'canvas1'）；
ctx=c.getContext（'2d'）；
setInterval（gameCanvas.drawDucks，2）；
gameCanvas.drawGame（）；
gameCanvas.moveTank（）；
},
drawGame:function（）
{
ctx.drawImage（bg，0,0）；
ctx.drawImage（坦克，gameCanvas.tankPos，400）；
drawImage（duck，gameCanvas.duckLeft，gameCanvas.duckTop）；
},
moveTank:function（）
{
document.onkeydown=函数（dir）
{
开关（方向键代码）
{
案例39：
{
如果（gameCanvas.tankPos<440）
{
gameCanvas.tankPos+=20；
gameCanvas.drawGame（）；
}
其他的
{
gameCanvas.tankPos；
}
打破
}
案例37：
{
如果（gameCanvas.tankPos>10）
{
gameCanvas.tankPos-=20；
gameCanvas.drawGame（）；
打破
}
}
案例17：
{
gameCanvas.fire（）；
}
}
}
},
drawDucks:function（）
{
if（gameCanvas.duckLeft<512）
{
gameCanvas.duckLeft+=1；
}
其他的
{
gameCanvas.duckLeft=-75
}
gameCanvas.drawGame（）；
}
}

当然可以。您需要为移动模式的最小y和最大y设置一个变量。大概是这样的：

var direction = 'down';
var minY = 100;
var maxY = 200;
var x = 400;
var y = 150;
var speed = 5;

if (direction == 'down')
{
    if (y <= maxY)
    {
        y += speed;
    }
    else
    {
        direction = 'up';
    }
}
else if (direction == 'up')
{
    if (y >= minY)
    {
        y -= speed;
    }
    else
    {
        direction = 'down';
    }
}
x -= speed;

var方向='down'；
var minY=100；
var maxY=200；
var x=400；
变量y=150；
无功转速=5；
如果（方向==“向下”）
{
if（y=minY）
{
y-=速度；
}
其他的
{
方向=‘向下’；
}
}
x-=速度；

这将使对象在向画布左边缘移动时在y轴上呈之字形

var direction = 'down';
var minY = 100;
var maxY = 200;
var x = 400;
var y = 150;
var speed = 5;

if (direction == 'down')
{
    if (y <= maxY)
    {
        y += speed;
    }
    else
    {
        direction = 'up';
    }
}
else if (direction == 'up')
{
    if (y >= minY)
    {
        y -= speed;
    }
    else
    {
        direction = 'down';
    }
}
x -= speed;