如何保存和恢复KineticJS的状态

How to save the state of a KineticJS and restore it

本文关键字：恢复 KineticJS 状态 何保存 保存      更新时间：2023-09-26

保存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

我还在我的舞台上捕捉到内容点击事件

stage.on("contentClick", setContentClick);

每次点击时，都会在舞台上使用背景层上的圆形绘制一个点

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

pointsAddd是我在后台添加的所有点的列表。我的问题是，对我来说，如何或什么是保存阶段及其所有子级和回调函数的当前状态并恢复它的最佳方式。我希望当用户使用下拉菜单时，能够在不同状态之间进行更改。

您可以使用toJSON()方法来实现这一点。这里有一个教程，您可以将Kinetic阶段的内容保存到JSON中。

重要信息：但是您应该注意，事件、函数回调和图像url是不可序列化的。换句话说，在从JSON加载回动能阶段之后，您将不得不再次重新分配所有事件、回调等，以便完全恢复以前的状态。

相关文章：