New to Telerik UI for ASP.NET AJAX? Start a free 30-day trial
Export to SVG
You can export RadDiagram as an SVG document on the client. This is done in two simple steps (Example 1):
-
Get a reference to the client-side object of the underlying Kendo UI diagram as described in the Overview help article.
-
Call the exportSVG method of the client-side object of the diagram.
The export to SVG functionality is currently supported in Firefox, Chrome, IE10+ and Opera 15.0+ (Blink).
Example 1: Export a diagram as an SVG document.
ASP.NET
<telerik:RadDiagram ID="RadDiagram1" runat="server">
<LayoutSettings Type="Tree" Subtype="Down" Enabled="true">
</LayoutSettings>
<ClientEvents OnLoad="onLoad" />
<ShapesCollection>
<telerik:DiagramShape Id="DiagramShape1"></telerik:DiagramShape>
<telerik:DiagramShape Id="DiagramShape2"></telerik:DiagramShape>
</ShapesCollection>
<ConnectionsCollection>
<telerik:DiagramConnection>
<FromSettings Connector="Top" ShapeId="DiagramShape1" />
<ToSettings Connector="Bottom" ShapeId="DiagramShape2" />
<StrokeSettings />
</telerik:DiagramConnection>
</ConnectionsCollection>
</telerik:RadDiagram>
<script type="text/javascript">
function onLoad(diagram) {
var diagramWidget = diagram.get_kendoWidget();
diagramWidget.exportSVG().done(function (data) {
kendo.saveAs({
dataURI: data,
fileName: "diagram.svg"
});
});
}
</script>
You can find a list of the available parameters of the exportSVG method in the Kendo UI Diagram API Reference.