Merging canvas serialization with metadata
I am creating an interactive environment based on kinetic.js. I want to be able to save and load the state of the canvas along with the metadata.
I already know what I can use stage.toJSON()
to serialize / save and use Kinetic.Node.create(stageJson, 'container')
to load. But I would like to add arbitrary data to this serialization that will keep track of additional properties that my environment will define / use.
An example of standard serialization kinetic.js:
{
"attrs": {
"width": 578,
"height": 200,
"x": 0,
"y": 0
},
"nodeType":"Shape",
"shapeType":"Rect"
}
An example of what I would like to save / load instead:
{
"attrs": {
"width": 578,
"height": 200,
"x": 0,
"y": 0
},
"nodeType":"Shape",
"shapeType":"Rect",
"metaData": {"foo": "bar"}
}
What would be the best approach here? I could hack / wrap the serialization and load functions to add / pop metadata before passing it in, but this seems awkward and difficult to implement, especially if there are many nested layers and forms to parse. I could save two completely separate serializations: one created by kinetic.js, and a parallel one generated by my own code, but again clunky. Anyone have any better ideas?
source to share
toJSON()
serializes all stage ( Node
) attributes .
I haven't tried it, but it seems like you can add your own attributes to the scene using setAttr(key,val)
. Once installed, they will be serialized and I assume deserialized as well ...
Please note that this is not exactly what you asked for as the additional data is not at the root JSON level, but rather in a sub-object attrs
source to share