Converting XML to SVG in mxGraph javascript

Question

I am trying to convert mxGraph's XML graph into SVG using JavaScript. Having XML string, I need to parse it into an SVG for distributing further to the html. This post shows exactly what I need to do with the solution implemented in Java . I can parse XML into graph and cannot render graph into SVG, cannot seem to find method that would be equivalent to drawCells() method in mxCellRenderer.js.

Would anyone be able to help on converting XML to SVG using JavaScript only (available mxGraph library)?

Miroslav Radojević · Accepted Answer · 2017-11-08T09:05:14.923

2

The solution that worked for me:

data - represents mxGraphModel XML

var doc = mxUtils.parseXml(data); // parse XML into document
var graph = new Graph(container, null, null, null, null); // create Graph instance, container is an HTML element where the SVG will be exported
var outputSvg = graph.getSvg("#FFFFFF", 1, null, null, true, null, null);

The final output is SVG object that can be included in HTML document:

document.getElementById('divForSvg').appendChild(outputSvg );

Check Graph.js an its getSvg() method for the details.

edited Nov 08 '17 at 09:05

answered Nov 08 '17 at 08:57

Miroslav Radojević

487
1
5
20

1

where have you used the existing XML to make the Graph .?? – Aman Deep Jul 08 '20 at 07:57

score 0 · Answer 2 · answered Oct 18 '17 at 10:50

0

Search for the setGraphXml function that is in the graphEditor example of mxGraph (in Editor.js)

This will read the xml and renders it on the graph

answered Oct 18 '17 at 10:50

Colin Claverie

789
9
11

Converting XML to SVG in mxGraph javascript

2 Answers2