如何保存KineticJS的状态并恢复它

时间:2014-09-22 08:06:36

标签: javascript kineticjs

保存KineticJs及其所有图层,形状和事件函数回调的最佳方法是什么。

我有以下

var stage; //KinetiJS stage
var backgroundLayer //KineticJS Layer
var backgroundImage //KineticJS Image
var extraGroup; //A group to hold some extra shapes
var lineGroup; // A group to hold some KineticJS lines

我还在舞台上看到了contentclick事件

stage.on("contentClick", setContentClick);

在每次点击时,使用适用于backgrounLayer的Cirlce形状在舞台上绘制一个点

var point = Kinetic.Circle(...);
//some code here
point.on('mouseenter', function()...)
point.on("mouseleave", function()...);
point.on("dragend", function()...);
pointsAdded.append(point);

pointsAdded是到目前为止在我的backgroundLayer上添加的所有点的列表,它在舞台上添加。我的问题是如何或什么是我用它的所有子节点和回调函数保存舞台的当前状态并恢复它的最佳方式。我希望能够在用户使用下拉菜单时在不同状态之间进行更改。

1 个答案:

答案 0 :(得分:0)

您可以使用toJSON()方法来实现此目的。这是一个tutorial,您可以将Kinetic阶段的内容保存为JSON。

重要说明但是您应该注意到事件,函数回调和图片网址不可序列化。换句话说,在从JSON加载动力学阶段之后,您将不得不重新分配所有事件,回调等,以便完全恢复之前的状态。