在Angular.js上的HTML5画布中，在背景图像上绘制矩形

<canvas id="myCanvas"></canvas>

var canvas = document.getElementById("myCanvas");
var ctx = canvas.getContext("2d");

var backgroundImage = new Image();
backgroundImage.src = "path/to/background-image.jpg";
backgroundImage.onload = function() {
  // 图像加载完成后执行绘制操作
  draw();
};

function draw() {
  // 绘制背景图像
  ctx.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);
}

function draw() {
  // 绘制背景图像
  ctx.drawImage(backgroundImage, 0, 0, canvas.width, canvas.height);

  // 绘制矩形
  ctx.fillStyle = "red"; // 设置矩形填充颜色
  ctx.fillRect(50, 50, 100, 100); // 绘制矩形，参数依次为起始点的x坐标、y坐标、宽度、高度
}