pts.js 'NS_ERROR_NOT_AVAILABLE:' 尝试将图像用于粒子时出错

Question

我想在 pts.js 中为粒子加载相同的图像。

当我尝试使用我的资产文件夹中的本地图像时，我在控制台中收到错误“NS_ERROR_NOT_AVAILABLE：”。

我在某处读到这可能是由于图像在加载之前就试图使用...

我还尝试使用指向其他图像而不是本地图像的外部链接，并且效果很好。所以不确定我的本地文件发生了什么。

编辑：

我只是在 chrome 而不是 firefox 上尝试过这个，我收到了一条新的更详细的错误消息。

“未捕获的 DOMException：无法在‘CanvasRenderingContext2D’上执行‘drawImage’：提供的 HTMLImageElement 处于‘损坏’状态。” 在 pts.min.js:6 中。

仍然不确定到底出了什么问题。

Pts.quickStart('#hello', 'transparent')

var world

// Loading in image to be used

var myImg = new Image()

myImg.src = '/assets/img/myImage.png'

space.add({

  start: (bound, space) => {

    // Create world and 100 random points

    world = new World(space.innerBound, 1, 0)

    let pts = Create.distributeRandom(space.innerBound, 20)

    // Create particles and hit them with a random impulse

    for (let i = 0, len = pts.length; i < len; i++) {

      let p = new Particle(pts[i]).size(i === 0 ? 10 : 20)

      p.hit(0, 0)

      world.add(p)

    }

    world.particle(0).lock = true

  },

  animate: (time, ftime) => {

    world.drawParticles((p, i) => {

// Image variable for the particle to be drawn as

      form.image(myImg)

    })

    world.update(ftime)

  },

  action: (type, px, py) => {

    if (type == 'move') {

      world.particle(0).position = new Pt(px, py)

    }

  },

  resize: (bound, evt) => {

    if (world) world.bound = space.innerBound

  }

})

space.bindMouse().bindTouch()

space.play()