0

我目前正在做一个允许用户制作幻灯片的应用程序。我正在使用 fabricjs 让他们在当前幻灯片上添加文本和内容。但我希望他们也能够添加新幻灯片。

因此,当他们点击“新幻灯片”按钮时,我需要一种方法来保存和存储当前幻灯片(画布)。
另一件事是允许用户通过从列中选择它们来编辑以前的画布。

我对 html5 和 fabricjs 比较陌生,所以我真的不知道该怎么做。我尝试过使用克隆功能,但并没有真正奏效,上一个画布中的 drawImage 也是如此。

有什么想法可以帮助我开始这件事吗?

我也一直在考虑存储创建的画布的方式,我想知道数组列表是否是一个好方法。

谢谢你的帮助

tl;dr :我想保存一个画布,清除它并在以后恢复它。

4

2 回答 2

1

您可以使用画布序列化将画布保存为 JSON,并在以后需要时恢复画布。对于详细的教程,这篇 fabricjs 文章是一个好的开始。

于 2013-03-01T10:02:55.977 回答
0
ctx.fillStyle= 'red'
//  draw a rectangle with default settings
     ctx.fillRect(0,0,150,150);
     //  Save the default state
     ctx.save();   



 ctx.fillStyle = '#66FFFF'       
     ctx.fillRect( 15,15,120,120); 
     // Save the current state
    // ctx.save();


 // Restore previous state
     ctx.restore();
     ctx.fillRect(45,45,60,60);

来自http://www.tutorialspoint.com/html5/canvas_states.htm的示例

于 2014-12-25T08:58:41.963 回答