Getting started vue 3 with Vue Smithchart component

Summarizing the above steps, update the src/App.vue file with following code.
 <template>
   <ejs-smithchart id="smithchart" :title="title" :legendSettings="legendSettings">
     <e-seriesCollection>
       <e-series :points="dataSource" :marker="marker" :tooltip='tooltip' :name="name" :reactance="reactance" :resistance="resistance"></e-series>
       <e-series :points="points" :tooltip='tooltip' :name="name1"></e-series>
     </e-seriesCollection>
   </ejs-smithchart>
 </template>

 <script>
 import { SmithchartComponent, SmithchartLegend, TooltipRender, SeriesCollectionDirective, SeriesDirective } from "@syncfusion/ej2-vue-charts";

 export default {
   components: {
     "ejs-smithchart": SmithchartComponent,
     "e-seriesCollection": SeriesCollectionDirective,
     "e-series" : SeriesDirective
   },
   data() {
     return {
       dataSource: [
         { resistance: 0, reactance: 0.05 }, { resistance: 0, reactance: 0.05 },
         { resistance: 0, reactance: 0.05 }, { resistance: 0, reactance: 0.05 },
         { resistance: 0, reactance: 0.05 }, { resistance: 0, reactance: 0.05 },
         { resistance: 0, reactance: 0.05 }, { resistance: 0, reactance: 0.05 },
         { resistance: 0, reactance: 0.05 }, { resistance: 0, reactance: 0.05 },
         { resistance: 0.3, reactance: 0.1 }, { resistance: 0.5, reactance: 0.2 },
         { resistance: 1.5, reactance: 0.5 }, { resistance: 2.0, reactance: 0.5 },
         { resistance: 2.5, reactance: 0.4 }, { resistance: 3.5, reactance: 0.0 },
         { resistance: 2.5, reactance: 0.4 }, { resistance: 3.5, reactance: 0.0 },
         { resistance: 2.5, reactance: 0.4 }, { resistance: 3.5, reactance: 0.0 },
         { resistance: 4.5, reactance: -0.5 }, { resistance: 5.0, reactance: -1.0 }
       ],
       points: [
         { resistance: 0, reactance: 0.15 }, { resistance: 0, reactance: 0.15 },
         { resistance: 0, reactance: 0.15 }, { resistance: 0.3, reactance: 0.2 },
         { resistance: 0.3, reactance: 0.2 }, { resistance: 0.3, reactance: 0.2 },
         { resistance: 0.3, reactance: 0.2 }, { resistance: 0.3, reactance: 0.2 },
         { resistance: 0.5, reactance: 0.4 }, { resistance: 1.0, reactance: 0.8 },
         { resistance: 2.5, reactance: 1.3 }, { resistance: 3.5, reactance: 1.6 },
         { resistance: 3.5, reactance: 1.6 }, { resistance: 3.5, reactance: 1.6 },
         { resistance: 4.5, reactance: 2.0 }, { resistance: 6.0, reactance: 4.5 },
         { resistance: 8, reactance: 6 }, { resistance: 10, reactance: 25 }
       ],
       tooltip: {
         visible: true
       },
       legendSettings: {
         visible: true
       },
       marker: {
         visible: true,
         dataLabel: {
           visible: true
         }
       },
       title: { text: 'Transmission lines applied for both impedance and admittance'},
       name: 'Transmission1',
       name1: 'Transmission2',
       reactance: 'reactance',
       resistance: 'resistance'
     };
   },
   provide: {
     smithchart:[SmithchartLegend, TooltipRender]
   }
 };
 </script>