Question

所以在我正在编写的这个项目中，我有一个包含图像的轮子。它们使用 canvas.getContext（'2d'）。drawImage（）函数绘制。我的第一个想法是，我将在循环中获得img，如下所示。

while(wheel){

    //all other code ^^        

    var imageObj = new Image();
    imageObj.src = getImgFromKeyword(passedLocations[i].keyword); //Will return a URL to an image
    var x = Math.cos(dp/2 + dp * i ) * (pr -  startPosInSlice) - imgsize/2;
    var y = Math.sin(dp/2 + dp * i ) * (pr - startPosInSlice) - imgsize/2;
    ctx.drawImage(imageObj, x, y, imgsize, imgsize);
}

然而，由于我在一个循环中运行它，我实际上加载了数千个时间成千上万的URL。我认为这对运行时来说是不够的。在初始化时将图像存储在数组中然后在图形中引用该对象会更有效。

祝你好运

Answer 1

你不应该每次都重新声明src，所以你需要把它放在你的循环之外。每次重置let imageObj = new Image(); imageObj.src = // load url while (wheel) { // draw your stuff }属性也没用，所以这是最好的方法：

  return fromPromise(Auth.signIn(username, password)).pipe(
   tap(user => {
     console.log('signIn Methode', user)
      if (user.challengeName === 'NEW_PASSWORD_REQUIRED') {
             this.navigate(['/completePassword']);
      }
  }), catchError(..){ }

更新图形Javascript时处理图像的最佳方法

1 个答案: