Javascript 如何使用Raphael在类似photoshop的div上拖动鼠标时绘制简单图形

这是我的代码：

<div id="handle" style="background:#5f3">

</div>

演示如下：

因此，如何绘制简单的图形（例如：rect），如photoshop

谢谢你，拉斐尔是一个图书馆，你要做的是

HTML

元素正是本例中所需的元素

<canvas id="bg" width="640" height="480"></canvas>

---

有关该主题的更多信息，请查看。

是否要用鼠标绘制矩形？不清楚“拖动鼠标时绘制简单图形”下的含义。画布如何更适合此任务？@Dmitry因为“像photoshop这样的简单图形（例如：rect）”？对我来说，他似乎想通过移动鼠标来模仿画笔画画（？）是的，我也没有回答这个问题。

<canvas id="bg" width="640" height="480"></canvas>

var bg = document.getElementById('bg').getContext('2d'); // retrieve the 2d context to draw on
bg.fillStyle = '#ff0000'; // set the fill color to red

// draw a filled rectangle at 20/20 thats 200x100 pixel in size
bg.fillRect(20, 20, 200, 100);