Save Draw.io diagram to Server and show the same on page load next time

[Santosh Gurav]

Save Draw.io diagram to Server and show the same on page load next time

I have integrated draw.io into my ASP.Net application. I want to store this diagram in SVG format on server, so I tried to refer their Save and Import functionality (SVG), but couldn't achieve that. Finally I managed to save the diagram with my code which is as below.

SaveDiagram = function () {
    var svgid = 'svgdiagram';
    $('#ifrmDiagram').contents().find('.geDiagramContainer').find('div').siblings('svg').attr('id', svgid);
    var imageData = Snap('#' + svgid);
    var encodedString = encodeURIComponent(imageData);

    $.ajax({
        url: rootDir + "api/Diagram/SaveDiagram",
        type: 'POST',
        data: '{ "KEY": "' + KEY + '", "ImageData" : "' + encodedString + '" }',
        contentType: 'application/json; charset=utf-8',
        dataType: 'json',
        success: function (msg) {
            alert('Success!');
        },
        error: function (xhr) {
            alert('Error!! ' + xhr.responseText);
        }
    });
}

This code saves the file to server but most of the times it looses the text contents and other styles used in the image. Also the saved image is surrounded by a lot of white space.

Does anybody know how the default functionality can be used to save the image into SVG format to server and also to import the same image on page load next time.

Any other workaround may also be appreciated.