Javascript 我怎样才能把一个图像放在画布上，然后在上面画一幅？

我在画布上绘制，我想在图像上绘制，然后将修改后的新图像绘制而不是旧图像保存在服务器上，我如何才能做到这一点

var img = document.getElementById('img');

var canvas = document.getElementById('can');

var dataURL = canvas.toDataURL();  


$.ajax({
     type: "POST", 
     url: "canvas_ajax_upload.php", 
     data: { img: dataURL }      
  }).done(function(msg){ 
     alert(msg); 
  });

在HTML中：

<img style="position:absolute;top:10%;left:10%"  width="833" height="602" id="img" src="http:..../Picture3.png"/>

<img style="position:absolute;top:10%;left:10%"  width="833" height="602" id="img" src="<?=$image?>"/> 

"/> 

---

我想保存图像和绘制的画布

---

这样，我只保存在画布上绘制的内容。

可能的重复我想将我正在绘制的图像和我绘制的内容保存为一个图像。您是否尝试过这样的操作：？