Javascript 使用html5画布的toDataURL绘制图像

我现在做的是：

我正在使用toDataURL方法存储画布的状态，并且还尝试使用drawImage方法在画布上绘制它

以下是一个片段：

var lastState = states[10]; //states is an array that saves all the toDataURL of the canvas
var permCtx = canvas.getContext('2d');
var img = new Image();
img.onload=function(){
  permCtx.drawImage(img,0,0);
}
img.src=lastState;

我在控制台中遇到以下错误：

414（请求URI太大）

---

是否有一种仅使用toDataURL方法在画布上绘制图像的方法？

您使用的机制应该可以工作；您看到此错误的操作系统/浏览器/版本是什么

不管怎样，尽管这应该是可行的，但如果您正在构建数据URL，然后在同一会话中恢复它们，这并不是最有效的。相反，我建议创建一个新的非DOM画布来存储您的状态，并使用它来绘制主画布：

var states = [];
function saveState(ctx){
  var c = document.createElement('canvas');
  c.width  = ctx.canvas.width;
  c.height = ctx.canvas.height;
  c.getContext('2d').drawImage(ctx.canvas,0,0);
  states.push(c);
  return c;
}

function restoreState(ctx,idx){
  var off = idx==null ? states.pop() : states[idx];
  ctx.drawImage(off,0,0);
}

---

错误是在

drawImage

行还是另一行？（或者你能给我们状态的内容[10]让我们自己看看吗？）我猜：这可能是IE8，它有一个已知的32kB的限制。相关：