Question

这里我想在1个函数中绘制不同的图像动画，如轨道轨迹，水平移动，垂直移动1个功能。

我从许多来源读到，我需要用参数调用方法。

首先，我尝试使用一个像行星轨道一样的轨道动画。但我的代码根本不起作用。我的代码出了什么问题？请帮忙＆amp;教我

var circleX = 200;
var circleY = 200; 
var radius = 150;
var length = 0;

var setX = 0;
var setY = 0;
var speed = 0.1;


function nextxy (circle) {
    context.clearRect(0, 0, canvas.width, canvas.height);

    context.fillStyle = "black";
    context.fillRect(0, 0, canvas.width, canvas.height);
    context.strokeStyle = "red";
    context.strokeRect(5, 5, 490, 490);

    //what's wrong with my code below?
    var circle = [
    setX = circleX + Math.cos(length) * radius;
    setY = circleY + Math.sin(length) * radius;
    length += speed;
    ]

context.beginPath();
var img = new Image();
img.src = "rock.png";
context.drawImage(img, setX, setY, 50, 50); 
context.fill();
}
setInterval(function(){nextxy(setX,setY,50,50)}, 30);

以下是我在没有调用参数的情况下所做的事情：http://jsfiddle.net/901Lt42m/1/

Answer 1

你应该声明你需要的所有参数，并使用它。

例如：

function nextxy(x, y, rx, ry) {
  ...
  setX = x + Math.cos(length) * rx;
  setY = y + Math.cos(length) * ry;
  length += speed;
  ...
}
....
nextxy(setX, setY, 50, 50);

Answer 2

您可以做的是将参数放入array这样nextxy([setX, setY, 50, 50])并按索引获取（circle[0]，circle[1]，circle[2]，{ {1}}）在您的函数中。

Fiddle

circle[3]

使用参数调用方法

2 个答案:

Fiddle