保存畫布作爲圖像只有可見區域

Question

我想從畫布保存圖像後調整大小或添加一些效果，但我無法保存畫布的可見區域它保存完整的圖像始終有任何方式我可以節省帆布無論是在它與PHP的唯一可見的部分或JavaScript或其他任何

我使用jQuery和PHP來挽救形象，但同樣的事情

var canvasData = canvas.toDataURL("image/png"); 
var postData = 'canvasData='+canvasData; 
var ajax = new XMLHttpRequest(); 
ajax.open('POST','http://localhost/canvas/imagesaver.php',true); 
ajax.setRequestHeader('Content-Type', 'canvas/upload'); 

這裏就是我試圖現在就做

http://jsfiddle.net/BPmb5/1/

Answer 1

僅客戶端解決方案：

1. 創造合適尺寸的第二畫布（或者你可以從你的頁面調整大小hiddon一個）
2. 使用第二畫布ctx.drawImage（canvas1的畫布上下文功能， SX，SY，SW，SH，DX，DY，DW，DH）
3. 使用.toDataURL（ 「圖像/ PNG」）在第二畫布