将画布保存为图像仅可见区域


save canvas as image only visible area

我试着在画布上保存一个图像在调整大小或添加一些效果之后但是我无法保存画布的可见区域它一直保存整个图像有没有办法我只能保存画布的可见部分不管它是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/

唯一客户端解决方案:

  1. 创建第二个大小合适的画布(或者你可以从你的页面中调整一个隐藏的画布)
  2. 使用第二个画布ctx的画布上下文函数。drawImage(画布1,sx, sy, sw, sh, dx, dy, dw, dh)
  3. 在第二个画布上使用。todataurl ("image/png")代码