Thu Apr 18 08:55:00 CST 2024 inscode

src/components/HelloWorld.vue

@@ -16,32 +16,7 @@ export default defineComponent({
   name: 'Demo',
   components: {RelationGraph},
   methods: {
-    test() {
-        const graphRef = this.$refs.graphRef
-        const __graph_json_data: RGJsonData = {
-            rootId: 'a',
-            nodes: [
-            { id: 'a', text: 'A', borderColor: 'yellow' },
-            { id: 'b', text: 'B', color: '#43a2f1', fontColor: 'yellow' },
-            { id: 'c', text: 'C', nodeShape: 1, width: 80, height: 60 },
-            { id: 'e', text: 'E', nodeShape: 0, width: 150, height: 150 }
-            ],
-            lines: [
-            { from: 'a', to: 'b', text: 'Line Text', color: '#43a2f1' },
-            { from: 'a', to: 'c', text: 'Line Text' },
-            { from: 'a', to: 'e', text: 'Line Text' },
-            { from: 'b', to: 'e', text: '', color: '#67C23A' }
-            ]
-        };
-      console.log(graphRef.value);
-      const graphInstance = graphRef.value!.getInstance();
-      graphInstance.setJsonData(__graph_json_data).then(() => {
-        // 这些写上当图谱初始化完成后需要执行的代码
-
-        // graphInstance.moveToCenter();
-        // graphInstance.zoomToFit();
-      });
-    }
+     
   },
   setup() {
     const graphRef = ref<RelationGraphComponent | null>(null);
@@ -93,12 +68,41 @@ export default defineComponent({
       console.log('onLineClick:', lineObject);
     };
 
+    const test = () => {
+         
+        const __graph_json_data: RGJsonData = {
+            rootId: 'a',
+            nodes: [
+            { id: 'a', text: 'A', borderColor: 'yellow' },
+            { id: 'b', text: 'B', color: '#43a2f1', fontColor: 'yellow' },
+            { id: 'c', text: 'C', nodeShape: 1, width: 80, height: 60 },
+            { id: 'e', text: 'E', nodeShape: 0, width: 150, height: 150 },
+            { id: 'e', text: 'E', nodeShape: 0, width: 150, height: 150 },
+            ],
+            lines: [
+            { from: 'a', to: 'b', text: 'Line Text', color: '#43a2f1' },
+            { from: 'a', to: 'c', text: 'Line Text' },
+            { from: 'a', to: 'e', text: 'Line Text' },
+            { from: 'b', to: 'e', text: '', color: '#67C23A' }
+            ]
+        };
+      console.log(graphRef.value);
+      const graphInstance = graphRef.value!.getInstance();
+      graphInstance.setJsonData(__graph_json_data).then(() => {
+        // 这些写上当图谱初始化完成后需要执行的代码
+
+        // graphInstance.moveToCenter();
+        // graphInstance.zoomToFit();
+      });
+    }
+
     return {
       graphRef,
       graphOptions,
       showGraph,
       onNodeClick,
-      onLineClick
+      onLineClick,
+      test
 
     };
   },