canvas 来自字符串的 toDataURL

Question

我是 canvas 的新手，但有一个很好的工作代码。结果就是生成了一个canvas然后转成base64.

问题是要让它工作，我似乎需要在 HTML 代码中有一个 canvas 元素，而我不需要显示 canvas 元素在页面上。

JS

var canvas = document.getElementById("canvas");
var context = canvas.getContext("2d");
...
console.log( canvas.toDataURL() );

HTML

<canvas id="canvas" width=64 height=64></canvas>

问题

我可以在不在 HTML 中添加 canvas 元素的情况下转到 toDataUrl 吗？
我唯一的选择是用 CSS 隐藏它吗？

Answer 1

您可以使用 document.createElement()

var canvas = document.createElement("canvas");
var context = canvas.getContext("2d");
canvas.width = 64;
canvas.height = 64; 
//....
console.log(canvas.toDataURL());

canvas 来自字符串的 toDataURL

canvas toDataURL from string

html

javascript

css

base64

canvas