javascript - 将图像存储为 Javascript 对象属性

Question

我想知道是否可以将图像存储为 js 对象的属性。例如，我目前有：

twitter = {h:35, w:35, x:0, y:0, src: "./twitter.png"};
tw = new Image;
tw.src = twitter.src;

然后在程序中

context.drawImage(tw, twitter.x, twitter.y, twitter.w, twitter.h);

但我想知道是否可以将图像 src 组合到 twitter 对象中，以便可以像这样调用它

context.drawImage(twitter.src, twitter.x, twitter.y, twitter.w, twitter.h);

谢谢，

汤姆

Answer 1

是的，new Image返回一个对象，您可以将任何对象作为属性值。所以试试这个：

twitter = {h:35, w:35, x:0, y:0, src: "./twitter.png"};
tw = new Image;
tw.src = twitter.src;
twitter.src = tw;
context.drawImage(twitter.src, twitter.x, twitter.y, twitter.w, twitter.h);

Answer 2

您可以使用画布的toDataURL()方法来获取图像的原始 base64 字节并将其存储在对象中