Javascript 如何在Fabric.js中将画布导出为HTML？

有没有办法使用fabricjs将包含多个对象的canvas元素导出到带有javascript代码的html？我知道我可以导出到JSON或toObject，但这不是html

---

我发现它有一个功能（文件>将画布导出为html），可以将画布绘图导出为本机html代码。fabricjs可以这样做吗

Fabric仅支持导出到（它自己的）对象表示形式、JSON（基本上是该对象表示形式的序列化）和SVG

如果您的目标是在fabric中创建一些内容，然后将其导出以在不支持canvas的环境中使用，那么您可能可以使用SVG—只要该环境中支持SVG

您还必须了解，没有“原生html代码”这样的东西。HTML有不同的版本-HTML4、HTML5等。画布被认为是一种。所以在画布上画东西绝对可以被认为是“使用原生html代码”；）

---

如果您想在没有画布和SVG的情况下重新创建结构渲染，那么结构确实无法提供任何帮助。尝试提供复杂SVG形状、图像（在各种变换下，如缩放/旋转）的无画布渲染将变得不必要的复杂，和其他对象。

我不明白您所说的“将画布导出为html”是什么意思：

是一个html实体…请转到并尝试它。您在canvimation上绘制一些东西，然后单击文件>“将画布导出为html”，这将打开一个新窗口，在没有canvimation库的情况下以本机html代码显示绘图。我明白了！最近我在画布导出方面做了一些技巧。导出“html导出”后，您希望如何处理它：保存它，将它插入另一个网页，等等？编辑：我这样问是因为在上面的示例中，导出为HTML函数所做的一切就是抓取

对象并将其粘贴到一个新窗口中，而不需要界面装饰。如果要操纵图像或在本地查看图像，您可以将其导出为SVG。我希望能够操纵某些对象的填充样式颜色。Fabricjs文档不是很有帮助。我希望使用Fabricjs kitchensink之类的工具创建一些画布图形，然后保存图形，以便稍后操纵其某些对象的颜色。例如，我希望在kitchensink上绘制一条街道使用交通灯，以某种方式保存它，然后调用其他地方并更改其交通灯的颜色。var arrow=fabric.Polygon（点，{fill:“red”，left:1，top:1}）。然后我可以使用arrow.set（fill:“green”）更改填充颜色。问题是当我运行var js=JSON.stringify（canvas）时；canvas.clear（）；loadFromJSON（js）；清除画布并加载JSON字符串后，我无法再使用arrow.set（fill:“green”）更改颜色。那么，有没有办法将与JSON字符串上的对象连接的变量保存下来？如何传递“id”在对象的json表示内部，这样我可以在加载json后调用它来处理重新加载画布上的特定对象？是的，

箭头从json重新加载画布后不再引用画布上的对象。此时，fabric创建了一组新的对象。如果它是画布上唯一的项目-如果您知道它的“索引”-您可以通过
canvas.item（0）
（或
canvas.item（index）
）检索它。否则，我想您需要扩展
toJSON
output（），以返回某种唯一的id。谢谢您，kangax。我在教程中用“id”扩展了json输出属性。在我加载FromJSON后，我根据id重新分配变量。注释中给出的答案是正确的，但我的问题不好，所以我将其勾选为已回答。谢谢again@kangax我找到了一个纯HTML画布保存到图像的示例。我仍然不太明白为什么FabricJS可以保存为SVG和JSON，却不能做到这一点。