New to Kendo UI for jQuery? Start a free 30-day trial

ExportImage

methods

Exports the diagram content as an image. The result can be saved using kendo.saveAs.

The full content of the diagram will be exported in 1:1 scale. If exporting the current view is desired then the kendo.drawing.drawDOM method should be called on a container element.

The export operation is asynchronous and returns a promise. The promise will be resolved with a PNG image encoded as a Data URI.

exportImage

Parameters:options.widthString

Parameters for the exported image.

options.heightString

The width of the exported image. Defaults to the diagram content width.

Returns:Promise

A promise that will be resolved with a PNG image encoded as a Data URI.

<button id="exportBtn">Export</button>
<div id="diagram"></div>
<script>
  $("#exportBtn").on("click", function(){
    var diagram = $("#diagram").getKendoDiagram();
    diagram.exportImage().done(function(data) {
      kendo.saveAs({
        dataURI: data,
        fileName: "diagram.png"
      });
    });
  });
  $("#diagram").kendoDiagram({
    dataSource: {
      data: [{ "items": [{ items: [{}] }] }],
      schema: { model: { children: "items" } }
    },
    layout: {
      type: "tree"
    }
  });
</script>