使用html5画布在鼠标上方查看矩形背景图像

Question

这里是关于jsfiddle的代码： https://jsfiddle.net/6u7bLkwc/

要重现我的问题，请按以下步骤操作：

• 单击图像并拖动鼠标以创建矩形。

• 完成后，将鼠标放在矩形上，这就是我的问题，你会看到一个黑色矩形。

我想当你将鼠标悬停在一个矩形上时，你会看到图像而不是黑色。

当我取消注释（ctx.clearRect）时：

function loop() {
  //ctx.clearRect(0,0,window.innerWidth, window.innerHeight);
  draw();
  requestAnimationFrame(loop);
}

鼠标悬停在矩形上，我看到一个灰色的颜色，似乎我们看到了空白的背景......我希望看到矩形下的图像。