How to load EJ1 diagram in EJ2 diagram

To load EJ1 JSON data in an EJ2 diagram, follow these steps.

  1. Import and inject the EJ1SerializationModule as shown in the following code example.
<template>
    <div id="app">
        <ejs-diagram ref="diagramObject" id="diagram"  :width='width' :height='height'></ejs-diagram>
    </div>
</template>
<script setup>
const width = "100%";
const height = "350px";
</script>
<template>
    <div id="app">
        <ejs-diagram ref="diagramObject" id="diagram"  :width='width' :height='height'></ejs-diagram>
    </div>
</template>
<script>
export default {
    name: 'App',
    data() {
        return {
            width: "100%",
            height: "350px",
        }
    },
}
</script>
  1. Load the EJ1 JSON data using the diagram loadDiagram method and set the second parameter to true.
<script setup>
import { onMounted } from "vue";

onMounted(function() {
    let diagram = document.getElementById("diagram").ej2_instances[0];
    let ej1Data = {"JSONData"};  //Replace JSONData with your EJ1 JSON data
    //Load the EJ1 JSON and pass a boolean value as true.
    diagram.loadDiagram(ej1Data, true);
})

</script>
<script>
export default {
    mounted: function() {
        let diagram = document.getElementById("diagram").ej2_instances[0];
        let ej1Data = {"JSONData"};  //Replace JSONData with your EJ1 JSON data
        //Load the EJ1 JSON and pass a boolean value as true.
        diagram.loadDiagram(ej1Data, true);
    }
}
</script>