HTML畫布 - 檢索用戶

Question

我一直在使用下面的教程，以允許用戶在繪製的圖像繪製的位置：

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

只是簡單的演示已經足以讓用戶做我想做的事。

我的下一個任務是獲取用戶繪製區域的座標並將它們存儲在數據庫中。該應用程序適用於物理治療師。這個想法是，用戶在他們受傷的身體上畫畫，然後理療師可以在稍後的日期將圖像與繪製的圖像合併。

2個問題真：

1. 如何檢索繪製在屏幕的面積有多大？
2. 從數據庫中檢索時，如何將圖形重新繪製到圖像上？

Answer 1

在教程中，您有兩個數組 - 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(); 
    } 

我才明白，你是否正確？