Exporting and importing JSON data to Cytoscape.js

Question

Based on this question and answer, I've made this JSFiddle.

What I'm trying to do is to find a way to properly export / import JSON data to cytoscape.js.

I'm using JSON.stringify(cy.json()) to get JSON data from elements, and on the other hand I'm cleaning the cy area and using cy.add(text-input) to add the elements back.

I.e.: you can add a node, copy it's JSON data generated, then you can refresh the browser and paste the JSON data from node directly, tryng to add it to cy.

But I couldn't get this to work, and I can't really figure out where I'm wrong (probably using the cy.add function). Always geting both errors:

An element must be of type 'nodes' or 'edges'; you specified 'undefined'

Uncaught TypeError: Cannot read property 'single' of undefined

Any ideas?

Thanks in advance.

Answer 1

If you build from the source (or use 2.1 when released), you can use eles.jsons(), which gives an array of element JSONs. You're calling cy.json(), which gives the entire graph init options JSON -- which you can't pass to cy.add() or similar.

Alternatively to eles.jsons(), you can use the already existing ele.json() and build up an array yourself by iterating over the elements.

You also need to pass the objects to cy.add() etc. You can't pass a JSON string.

e.g.

cy.add( JSON.parse( jsonString ) )