fix: update to latest @antv/g

package.json

@@ -31,11 +31,11 @@
     "@rollup/plugin-node-resolve": "^15.2.3",
     "@rollup/plugin-terser": "^0.4.4",
     "@rollup/plugin-typescript": "^11.1.6",
-    "@swc/core": "^1.5.5",
+    "@swc/core": "^1.5.7",
     "@swc/jest": "^0.2.36",
     "@types/jest": "^29.5.12",
     "@types/jsdom": "^21.1.6",
-    "@types/node": "^20.12.11",
+    "@types/node": "^20.12.12",
     "@typescript-eslint/eslint-plugin": "^6.21.0",
     "@typescript-eslint/parser": "^6.21.0",
     "chalk": "^4.1.2",

packages/g6-extension-3d/package.json

@@ -33,20 +33,20 @@
   },
   "dependencies": {
     "@antv/g-device-api": "^1.6.4",
-    "@antv/g-plugin-3d": "^1.9.34",
-    "@antv/g-plugin-device-renderer": "^2.0.0",
-    "@antv/g-plugin-dragndrop": "^1.8.22",
-    "@antv/g-webgl": "^1.9.37",
+    "@antv/g-plugin-3d": "^2.0.6",
+    "@antv/g-plugin-device-renderer": "^2.0.6",
+    "@antv/g-plugin-dragndrop": "^2.0.4",
+    "@antv/g-webgl": "^2.0.6",
     "@antv/util": "^3.3.7"
   },
   "devDependencies": {
-    "@antv/g": "^5.18.25",
-    "@antv/g-canvas": "^1.11.27",
+    "@antv/g": "^6.0.5",
+    "@antv/g-canvas": "^2.0.4",
     "@antv/g6": "workspace:*"
   },
   "peerDependencies": {
-    "@antv/g": "^5.18.25",
-    "@antv/g-canvas": "^1.11.27",
+    "@antv/g": "^6.0.5",
+    "@antv/g-canvas": "^2.0.4",
     "@antv/g6": "^5.0.0-beta.30"
   }
 }

packages/g6-extension-3d/src/elements/line-3d.ts

@@ -16,7 +16,7 @@ export class Line3D extends BaseEdge {
     const [x2, y2, z2] = targetNode.getPosition();
 
     // omit path
-    const { path, ...style } = super.getKeyStyle(attributes);
+    const { d, ...style } = super.getKeyStyle(attributes);
     return { x1, y1, z1, x2, y2, z2, ...style };
   }
 

packages/g6-extension-react/package.json

@@ -9,6 +9,7 @@
     "react",
     "node"
   ],
+  "repository": "https://github.com/antvis/G6.git",
   "license": "MIT",
   "author": "Aarebecca",
   "main": "lib/index.js",
@@ -33,8 +34,8 @@
     "type-check": "tsc --noEmit -p tsconfig.test.json"
   },
   "dependencies": {
-    "@antv/g": "^5.18.25",
-    "@antv/react-g": "^1.10.28"
+    "@antv/g": "^6.0.5",
+    "@antv/react-g": "^2.0.5"
   },
   "devDependencies": {
     "@ant-design/icons": "^5.3.6",

packages/g6/__tests__/demos/element-edge-custom-arrow.ts

@@ -9,17 +9,17 @@ export const elementEdgeCustomArrow: TestCase = async (context) => {
         source: 'node1',
         target: 'node2',
         style: {
-          endArrowPath: 'M0,0 L10,4 L14,14 L18,4 L28,0 L18,-4 L14,-14 L10,-4 Z',
-          endArrowOffset: 14,
+          endArrowD: 'M0,0 L10,4 L14,14 L18,4 L28,0 L18,-4 L14,-14 L10,-4 Z',
+          endArrowOffset: 28,
         },
       },
       {
         id: 'custom-arrow-2',
         source: 'node3',
         target: 'node4',
         style: {
-          endArrowPath: 'M 3,-5 L 3,5 L 15,10 L 15,-10 Z',
-          endArrowOffset: 10,
+          endArrowD: 'M 3,-5 L 3,5 L 15,10 L 15,-10 Z',
+          endArrowOffset: 20,
         },
       },
       {
@@ -30,6 +30,8 @@ export const elementEdgeCustomArrow: TestCase = async (context) => {
           endArrowSrc: 'https://gw.alipayobjects.com/mdn/rms_6ae20b/afts/img/A*N4ZMS7gHsUIAAAAAAAAAAABkARQnAQ',
           endArrowSize: 28,
           endArrowTransform: 'rotate(90deg)',
+          endArrowX: -14,
+          endArrowY: -14,
         },
       },
     ],

packages/g6/__tests__/demos/index.ts

@@ -92,6 +92,7 @@ export * from './layout-radial-configuration-translate';
 export * from './layout-radial-prevent-overlap';
 export * from './layout-radial-prevent-overlap-unstrict';
 export * from './layout-radial-sort';
+export * from './perf-fcp';
 export * from './plugin-bubble-sets';
 export * from './plugin-camera-setting';
 export * from './plugin-contextmenu';

packages/g6/__tests__/demos/perf-fcp.ts

@@ -0,0 +1,34 @@
+import { Graph } from '@/src';
+
+export const perfFCP: TestCase = async (context) => {
+  const data = {
+    nodes: new Array(1000).fill(undefined).map((_, i) => ({ id: `${i}` })),
+  };
+
+  const graph = new Graph({
+    ...context,
+    data,
+    node: {
+      type: 'circle', // 👈🏻 Node shape type.
+      style: {
+        size: 40,
+        labelText: (d) => d.id!,
+        iconHeight: 20,
+        iconWidth: 20,
+        iconSrc: 'https://gw.alipayobjects.com/zos/basement_prod/012bcf4f-423b-4922-8c24-32a89f8c41ce.svg',
+      },
+    },
+    layout: {
+      type: 'grid',
+    },
+  });
+
+  const timeStart = performance.now();
+
+  await graph.render();
+
+  const timeElapsed = performance.now() - timeStart;
+  console.log('timeElapsed', timeElapsed);
+
+  return graph;
+};