1

我一直在使用以下教程来允许用户在图像上绘制：

http://www.williammalone.com/articles/create-html5-canvas-javascript-drawing-app/#demo-simple

只是简单的演示就足以让用户做我想做的事。

我的下一个任务是获取用户绘制的区域的坐标并将它们存储在数据库中。该申请适用于物理治疗师。这个想法是，用户在他们受伤的身体上画画，然后理疗师可以在以后将图像与绘制的图像一起显示。

真的有2个问题：

  1. 如何检索绘制的屏幕区域？
  2. 从数据库中检索时，如何将形状重新绘制到图像上？
4

1 回答 1

0

在本教程中，您有两个数组 - clickX、clickY。在 mouseleave 和 mouseup 之后从这些数组中保存点。这将是该地区。要绘制形状序列化所有区域，以便它们在客户端上可用，并使用重绘方法中的代码绘制所有区域，例如

for(var i=0; i < clickX.length; i++)
  {     
    context.beginPath();
    if(clickDrag[i] && i){
      context.moveTo(clickX[i-1], clickY[i-1]);
     }else{
       context.moveTo(clickX[i]-1, clickY[i]);
     }
     context.lineTo(clickX[i], clickY[i]);
     context.closePath();
     context.stroke();
  }

我理解你正确吗？

于 2012-07-19T07:22:30.900 回答