Cytoscape style is not being preserved

[canbax]

1-) I have an cytoscape.js graph. Ideally it looks like below

2-) If I empty styles of cytoscape by executing js code cy.style([]), graph looks like below

3-) If I set cytoscape style with a command like cy.style([/* some big array object */ ]) it becomes as the ideal like the first image.

4-) When I execute cy.graphml() on first image to generate xml. Then load using command cy.grapml('xml string previously generated') on a empty canvas I get

5-) As could be seen from above image, graphml does not preserve style information (I tried with css: true also). When I apply the old styles like in step 3, I expect to see a graph like first image but it does not. The above image doesn't change a bit

6-) When I give the same object as a string like cy.style('[/* some big array object */ ]') it gives me a bit more stylish graph (below image)

[alihanokka]

This issue is also related with #15 . As it was explained there, this extension does not identify style keywords used ('shape', 'position', 'background-color' etc) inside the graphml/xml object. It puts all properties found inside the data attribute. As a result, Cytoscape doesn't get any style information.

Also for the positions, it runs the cose-bilkent layout on the graph (Default layout is not 'preset'!, but the positions are lost anyway). The width and height of the nodes are not found and assigned as [1,1](or something close). That is why you are getting that output in (4).

In CiSE's demo, I had to change the style information 'manually' after I imported the graph from xml to get around this problem. For instance,

'width': 'data(width)', 
'height': 'data(height)', 
'shape': function (ele) { 
    let str = '' + ele.data('shape'); 
    return str.toLowerCase(); 
}

So the attributes are all parsed fine, just not stored correctly.