我正在为网站创建javascript应用,我需要在画布上显示网格和2张图像。除了我打开控制台外,其他所有东西都在工作。打开控制台时,显示了从简单的线条创建的网格,但没有显示图像,因此我无法调试它。有人知道如何解决这个问题吗?
this.interval = setInterval(() => {
this.draw();
}, 10);
draw() {
this.ctx.clearRect(0, 0, this.canvas.width, this.canvas.height);
this.ctx.fillStyle = 'white';
this.ctx.fillRect(0, 0, this.sizeX, this.sizeY);
this.ctx.drawImage(this.getOverlay(), 0, 0, this.sizeX, this.sizeY);
const countX = Math.floor(this.sizeX / this.gridSize);
const countY = Math.floor(this.sizeY / this.gridSize);
this.ctx.fillStyle = 'rgba(218, 218, 218, .5)';
for (let i = 0; i < countX; i++) {
this.ctx.fillRect(this.gridSize * (i + 1), 0, 1, this.sizeY);
}
for (let i = 0; i < countY; i++) {
this.ctx.fillRect(0, this.gridSize * (i + 1), this.sizeX, 1);
}
this.draggable();
}
draggable() {
this.ctx.globalAlpha = this.opacity;
this.ctx.drawImage(
this.getImage(),
this.draggablePositionX,
this.draggablePositionY,
this.draggableSizeX,
this.draggableSizeY
);
this.ctx.globalAlpha = 1;
}