Custom viewer doesn't render correctly some shapes

Question

I realized a custom viewer to display diagrams realized with diagrams.net editor. More or less my code is:

<script src="http://localhost:8080/my-viewer/mxgraph/js/app.min.js type="text/javascript"></script>
<script src="http://localhost:8080/my-viewer/mxgraph/js/shapes.min.js type="text/javascript"></script>
<script src="http://localhost:8080/my-viewer/mxgraph/js/stencils.min.js type="text/javascript"></script>
<script src="http://localhost:8080/my-viewer/mxgraph/js/extensions.min.js type="text/javascript"></script>

    var graph = new mxGraph(container)
    diagram = mxUtils.parseXml(xmlDiagram);
    codec = new mxCodec(diagram);
    codec.decode(diagram.documentElement, graph.getModel());
    graph.fit();

It works quite well but I noticed that some shapes are rendered as rectangles instead of circles,triangles and ellipses, like in the following picture where on the right I highlighted in red the wrong shapes:

I suppose I am missing to include something concerning styles or shapes (JS module, xml file, ...) from draw.io webapp but I can't figure out which one. Can anyone give me some hint? Thanks in advance, Marco

score 1 · Answer 1 · answered Apr 12 '22 at 09:22

I eventually found the solution. The problem is that some shapes in the diagram definition file doesn't have the 'shape' property. For example, triangle is generated by this tag:

but it should be

See here the full discussion on draw.io project Github.

Custom viewer doesn't render correctly some shapes

1 Answers1