Fabric.js 直接从 JSON 到 PNG答案

【问题标题】：Fabric.js going directly from JSON to PNGFabric.js 直接从 JSON 到 PNG
【发布时间】：2016-01-14 04:17:09
【问题描述】：

我需要从 fabric.js 创建保存的字符串化 JSON 的 PNG 缩略图

我有一个数据库，我正在将画布中的 JSON 数据保存到其中，但我需要使用此保存的 JSON 数据创建一个 PNG 缩略图库。

而不是在页面上创建一堆画布并做这样的事情。

canvas.loadFromJSON(JSONDATA); 
thumbImage = canvas.toDataURL('png');
$(this).attr('src', thumbImage);

我只需要直接从 JSON 数据创建 PNG。这可能吗，如果可以，我该怎么做？

【问题讨论】：

标签： javascript jquery json fabricjs

【解决方案1】：

您还有另一种替代方法是创建一个生成画布并使其不显示，创建一个隐藏画布来生成您的 png，就像您可以从隐藏的内容画布生成图像一样。

<canvas id='c' width='150' heigh='150' style='display: none;'><canvas>

<script>
    var canvas = new fabric.Canvas('c');
    canvas.loadFromJSON(json);
    canvas.toDataURL('png');
</script>

【讨论】：

【解决方案2】：

JSON 数据是 FabricJS 用于创建画布的一组指令。然后可以将画布转换为图像。

因此，是的，您需要先创建画布，然后再创建图像。

另一种方法是创建一个运行 NodeJS 的服务器，该服务器可以运行 FabricJS。最终，您将在那里执行相同的任务 - 创建一个画布，然后生成图像。但是这里的好处是它是一个服务器进程，它将文件直接保存到服务器，因此这个任务可以自动化。

但设置服务器和编写脚本来执行此任务可能需要比您的任务需要更多的工作 - 取决于您需要执行此操作的频率。

This post discusses how to install NodeJS and FabricJS。这将使服务器启动并运行，但您还需要编写服务器脚本。

【讨论】：