2012-09-01 57 views
2

我想知道是否有任何方法可以獲取畫布標記中當前繪製的路徑的像素數據。HTML 5畫布 - 獲取路徑的像素數據

當繪製簡單形狀(如方形或線條)時,我可以自己計算像素數據,但事情會變得比較複雜,如橢圓形或甚至簡單的圓形。

我問這個問題的原因是因爲我正在處理一個Web應用程序,它涉及向畫布添加路徑時將畫布像素數據發送到服務器。服務器需要保留它自己的整個畫布的副本,我真的不希望發送整個畫布圖像每一個變化,但只有三角洲效率的原因...

謝謝。

回答

2

第1步:繪製路徑到第二個與您原來相同大小的畫布,我們稱之爲'路徑畫布'。

第2步:將路徑畫布的globalCompositeOperation設置爲'destination-in'。

第3步:你畫帆布面料到路徑帆布

第4步:通過循環路徑畫布的所有像素和存儲不是透明的任何格式你將它們發送到服務器的像素。

+1

感謝您的回答,這顯然會做需要的,但是每次我在畫布上添加一些東西時,請按照這些步驟執行這些步驟並不是非常有效...... –

+1

但是如果不復制整個原始畫布,我會跟蹤。路徑的最小邊界矩形,僅在此部分使用getImageData,然後將putImageData放在路徑畫布上,然後僅收集非透明像素? –

+0

這取決於每個繪圖操作的大小會更快,但這是幹什麼用的?你確定只保留每個繪圖操作的記錄並根據需要重複記錄並不好嗎?像素數據通常不是存儲事物的最有效方式。 – hobberwickey