仅在Safari上-画布错误：IndexSizeError（DOM异常1）：索引不在允许的范围内

Question

我不知道这里发生了什么，但是我有一个画布错误，仅在Safari中发生-Chrome和Firefox都可以。

香港专业教育学院看过这样的问题，如索引不在允许的范围内，但我认为它不是同一问题。错误是：

 IndexSizeError (DOM Exception 1): The index is not in the allowed range.

它在这里绘制，仅当我注释掉所有drawImage行时才消失：

this.draw = function (bubbleShape, dx, dy) {

        ctx.fillStyle = this.color;
        if(this.isPerson && pointCollection.points.length > 0 && peopleCollection.points.length > 0) //people
        {
          if(!this.hasBack)
          {
            var img2 = new Image();
            img2.src = `../resources/bod${parseInt((this.ico).match(/[0-9]+/)[0], 10)}.png`;
            var mod = 1.05;
            ctx.drawImage(img2, this.originalPos.x-(this.radius+1.5), this.originalPos.y-this.radius+27, this.radius*mod, this.radius*mod);

          }

          //ctx.fillStyle = "rgba(255, 255, 255, 0)";
          ctx.drawImage(this.img, this.originalPos.x-this.radius, this.originalPos.y-this.radius, this.radius, this.radius);
            this.img.src = this.ico; //GET ICO
        }


        if (bubbleShape == "square") { //**must call any draw methods here
            ctx.beginPath();
            ctx.fillRect(this.curPos.x + dx, this.curPos.y + dy, this.radius * 1.5, this.radius * 1.5);

        } else if (!this.isPerson){ //THIS for normal ------------
            ctx.beginPath();
            ctx.arc(this.curPos.x + dx, this.curPos.y + dy, this.radius, 0, Math.PI * 2, true);
            ctx.fill();

            if(ctx.fillStyle === '#4c4c4c')
            {
            ctx.lineWidth = 4;
            ctx.strokeStyle = '#3d3d3d';
            ctx.stroke();
          }
        }
    };

HTML-画布确实存在：

<canvas class = "myCanvas out" height = "900"></canvas>

这里有什么问题？我已经确定了画布最初是在display：block上显示的。绘制图像有什么问题？