HTML5画布:toDataURL()

时间:2020-01-09 10:34:40  来源:igfitidea点击:

使用canvas的toDataURL()函数可以获取HTML5画布的内容。这是完成的代码示例:

var canvas  = document.getElementById("ex1");
var dataUrl = canvas.toDataURL();

从toDataURL()函数返回的数据是一个字符串,表示包含抓取的图形数据的编码URL。该字符串可以显示在textarea元素中,如下所示:

var canvas  = document.getElementById("ex1");
var dataUrl = canvas.toDataURL();

document.getElementById("textArea").value = dataUrl;

也可以在新窗口中显示获取的数据。这是执行此操作的代码:

var canvas  = document.getElementById("ex1");
var dataUrl = canvas.toDataURL();

window.open(dataUrl, "toDataURL() image", "width=600, height=200");