How to Save, Export, and Print a Vue Diagram

Описание: Learn how to save and export a Syncfusion Vue Diagram. This video demonstrates how to save and load the Vue Diagram as a string and file stream. It also shows you how to export a diagram in different file formats and print it.

The Vue Diagram is a feature-rich library for visualizing, creating, and editing interactive diagrams. It lets users create flowcharts, organizational charts, mind maps, and BPMN charts through code or a visual interface. Populate diagrams with nodes and connectors created and positioned based on data from data sources. Without having to write any code, easily convert, map, and consume data in any format in the Diagram by setting a few properties.

Serialization is the process of saving and loading the Diagram for state persistence. The Diagram is serialized as a string while saving using the client-side method saveDiagram. The Diagram is loaded from the serialized string data by the client-side method loadDiagram.

The Syncfusion Vue Diagram can also be saved as raster or vector image files. The Diagram supports exporting to PNG, JPEG, and SVG formats. To print and export it, you need to inject PrintAndExport in the Diagram. The client-side method exportDiagram exports the Diagram. The client-side method print prints it.

Explore our tutorial videos: https://www.syncfusion.com/tutorial-v...

Example project: https://github.com/SyncfusionExamples...

TRIAL LICENSE KEY
-----------------------------
If you need a trial license key, start your Vue trial from https://www.syncfusion.com/downloads/... under your Syncfusion account. There, you can obtain your trial license key from the downloads page.

Check whether you are eligible for a free license for all Essential Studio products on our Community License page: https://www.syncfusion.com/products/c...

BOOKMARK DETAILS
------------------------------
[00:00] Introduction
[00:51] Save and load Diagram using string data
[03:59] Save Diagram as file stream
[05:31] Load Diagram using file stream
[09:13] Export Diagram as image
[11:17] Print Diagram

VUE DIAGRAM
---------------------
Product overview: https://www.syncfusion.com/vue-compon...
Examples: https://ej2.syncfusion.com/vue/demos/...
Documentation: https://ej2.syncfusion.com/vue/docume...
Download free trial: https://www.syncfusion.com/downloads/...
npmjs package: https://www.npmjs.com/package/@syncfu...

SUBSCRIBE   
 ----------    
Syncfusion on YouTube:    / syncfusioninc  
Sign up to receive email updates: https://www.syncfusion.com/account/em...
   
SOCIAL COMMUNITIES   
 -----------------------------    
Facebook:   /       
Twitter:   / syncfusion      
LinkedIn:   / syncfusion      
Instagram:   / syncfusionofficial     

#vue #export #diagram