未捕获的TypeError：调用push（）时发生类型错误

Question

我正在尝试在canvas上模拟烟雾。 我想创建一个新的烟熏，并将其推入烟熏阵列中，但是我一直收到"Uncaught TypeError: Type error"错误。
有人知道我想念什么吗？

var puffs = [];

this.tick = function() {
    var puffLength = puffs.length;
    if ( addPuffs && ( puffLength < maxParticles )) {
        puffs.push({ //THIS ONE IT WHAT GIVES ME THE ERROR
            posX: oPoint.x,
            posY: oPoint.y,
            scale: .1,
            age: 0
        });
    }

    for(var i = 0; i < puffLength; i++) {

        var currentPuff = puffs[i];

        if(currentPuff.age == maxLife) {
            puffs.splice(i, 1);
        } else {
            currentPuff.posX += windX,
            currentPuff.posY += windY,
            currentPuff.scale += growingSpeed,
            currentPuff.age++;
        }

    }

    this.render();

}

Answer 1

在提供的小提琴中， addPuffs 。 您需要根据业务逻辑定义此变量。 还没有定义oPoint.x和oPoint.y ，它们也必须根据您的业务逻辑进行初始化。

var oPoint = {x:1, y:2}; //declare according to logic
var addPuffs = true; //some logic here
if ( addPuffs && ( puffLength < maxParticles )) {
    puffs.push({ //THIS ONE IT WHAT GIVES ME THE ERROR
        posX: oPoint.x,
        posY: oPoint.y,
        scale: .1,
        age: 0
    });
}

另外，在canvas上使用drawImage() ，我相信第一个参数必须是DOM元素，而不是图像的路径。

尝试：

  var img = new Image();
  img.src = "/static/img/particle.png";
  //Omitted code
  ctx.drawImage(img,80,80,1,1);