javascript - 在图像上画一条线

Question

我试图在加载图像后画一条线。该线是手动绘制的。一旦我尝试上传图像并在其上绘制一些东西，它就会停止工作。谁能告诉我如何重叠图像的 id 和绘图框的 id。

点击here查看绘图的演示

<canvas id="canvas" width="300" height="300" style="border: 1px solid black;"></canvas>
<div id="coord"></div>

非常感谢。

Answer 1

只需将 Canvas 放在 div 中并更改 div 的背景图像

<div style="background: url('http://upload.wikimedia.org/wikipedia/commons/1/12/Mouse_line_drawing.jpg');width:auto;height:auto;display:inline-block;">
    <canvas id="canvas" width="300" height="300" style="border: 1px solid black;"></canvas>
</div>
<div id="coord"></div>