Canvas drawImage使用数据URL [英] Canvas drawImage using data URL
问题描述
我将从脚本开始:
function saveInstance(){
_savedInstance = document.getElementById('canvasID')。toDataURL();
}
function restoreInstance(){
ctx.drawImage(_savedInstance,0,0);
}
目的是保存画布的实例,然后重新应用但是,我得到的错误说,不兼容的类型(未捕获的错误:TYPE_MISMATCH_ERR:DOM异常17 )。是否有任何canvas方法允许我使用数据URL字符串重新绘制实例?
**如果有一个更好的方法来实现这个保存/恢复
-Firstmate
是的,您可以使用 _savedInstance
创建一个图像元素,然后将其绘制到画布上。
var img = new Image();
img.src = _savedInstance;
ctx.drawImage(img,0,0);
I'll start with the script:
function saveInstance() {
_savedInstance = document.getElementById('canvasID').toDataURL();
}
function restoreInstance() {
ctx.drawImage(_savedInstance,0,0);
}
The purpose is to save an instance of the canvas and re-apply it later [Similar to how ctx.save() saves the style and transformations].
However, I got the error that says incompatible types (Uncaught Error: TYPE_MISMATCH_ERR: DOM Exception 17). Is there any canvas method that will allow me to use the data URL string to re-draw the instance?
**If there's a better way to implement this save/restore idea I have, that'd also be much appreciated.
-Firstmate
Yes, you can create an image element with its source as _savedInstance
and then draw it to the canvas.
var img = new Image();
img.src = _savedInstance;
ctx.drawImage(img,0,0);
这篇关于Canvas drawImage使用数据URL的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!