如何在createjs中将文本转换为位图？

Question

例如我有这段代码：

var text = new createjs.Text("Hello World", "Bold 10px Arial", "#000000");

我希望它变成位图。

Answer 1

也许您误解了如何使用createJS渲染对象？

所有内容（图片，文字，动画）都是在canvas上绘制的，这意味着它们不会作为单独的元素（如文字）存在，而是作为“绘图”和＃39 ;。这也意味着您可以随时在图像中进行转换。

您可以通过右键单击canvas并保存图像（如果只需要一次，或以编程方式保存图像）来执行此操作：

image.src = canvas.toDataURL('image/jpeg');

或

image.src = canvas.toDataURL('image/png'); //larger, higher quality

Answer 2

您可以使用cache()方法创建内容的屏幕外画布。

var b = text.getBounds();
text.cache(b.x, b.y, b.width, b.height, 2);

这是一个显示缓存的示例，以及将缓存导出到dataURL，然后使用它生成图像。 http://jsfiddle.net/0wgwaLr6/

var url = text.cacheCanvas.toDataURL();
var img = document.createElement("img");
img.src = url;