Skip to content

Commit 557c21e

Browse files
author
Anto Gibson
authored
Update README.md
1 parent 4405734 commit 557c21e

File tree

1 file changed

+32
-2
lines changed

1 file changed

+32
-2
lines changed

README.md

Lines changed: 32 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,32 @@
1-
# how-to-save-and-export-the-react-diagram
2-
A quick-start React app that shows how to save, export and print the contents of the React Diagram component.
1+
# How to Save and Export the React Diagram
2+
A quick-start project that shows how to add the Vue Ribbon Component to the Vue application. Learn how to save the contents of the Diagram component as a JSON string or a file stream and load the diagram using the saved files. Also learn how to export the diagram component, in the form of a printed PDF or image formats like PNG, SVG, etc.
3+
4+
The React Diagram is a feature-rich component for visualizing, creating, and editing interactive diagrams. It supports creating flowcharts, organizational charts, mind maps, and BPMN charts through code or a visual interface. Grouping is used to cluster multiple nodes and connectors into a single element. A group acts like a container for its children.
5+
6+
Documentations:
7+
- [Export](https://ej2.syncfusion.com/react/documentation/diagram/export)
8+
- [Print](https://ej2.syncfusion.com/react/documentation/diagram/print)
9+
10+
Demo: [https://ej2.syncfusion.com/react/demos/#/fluent2/diagram/grouping-and-ordering](https://ej2.syncfusion.com/react/demos/#/material3/diagram/default-functionality.html)
11+
12+
------------------------------------------------------------------------------------------------
13+
14+
## Project prerequisites
15+
Make sure that you have the compatible versions of [Visual Studio Code](https://code.visualstudio.com/download ), and [NodeJS](https://nodejs.org/en/download) or a later version on your machine before starting to work on this project.
16+
17+
-------------------------------------------------------------------------------------------------
18+
19+
## How to run this application
20+
To run this application, follow these steps:
21+
- **Step 1:**
22+
Clone the repository.
23+
```bash
24+
git clone https://github.com/SyncfusionExamples/how-to-save-and-export-the-react-diagram
25+
```
26+
- **Step 2:**
27+
Open the application folder, install the dependencies and run the application.
28+
```bash
29+
cd how-to-save-and-export-the-react-diagram
30+
npm install
31+
npm start
32+
```

0 commit comments

Comments
 (0)