在网格上绘制线条

Question

我有一个图像上有网格线,并希望允许用户在这些网格线上绘制更粗的线条,每条线条应该从一个交叉点到下一个交叉点.我应该在哪里开始研究？我意识到这可能是一个非常广泛的问题,我只想在这里寻找一些方向.寻找php和jquery/javascript解决方案.

非常感谢,托德

Answer 1

你可以使用<canvas>元素.

1. 使用将图像加载到画布中.drawImage().
2. onclick为画布和绘制线创建处理程序.
3. 使用将画布的输出保存到图像中toDataURL().

链接:

• 这个答案演示了如何在画布上绘制图像并检索结果.toDataURL().

• 这个答案包含如何检索画布上的点击坐标的代码.

更新:

作为奖励:HERE是玩的代码:).绘图就在那里,但必须添加对网格的捕捉.使用Chrome和Firefox进行测试.