chore: transform to transforms

packages/site/examples/feature/features/demo/itemAnimates.js

@@ -246,10 +246,34 @@ const showHideActions = {
   },
 };
 
+const viewPortActions = {
+  'Fit View': () => {
+    graph.fitView({}, { duration: 500 });
+  },
+  'Fit Center': () => {
+    graph.fitCenter({}, { duration: 500 });
+  },
+  'Zoom In': () => {
+    const currentZoom = graph.getZoom();
+    graph.zoomTo(currentZoom * 1.1, undefined, { duration: 500 });
+  },
+  'Zoom Out': () => {
+    const currentZoom = graph.getZoom();
+    graph.zoomTo((currentZoom * 1) / 1.1, undefined, { duration: 500 });
+  },
+  Translate: () => {
+    graph.translate({ dx: Math.random() * 200 - 100, dy: Math.random() * 200 - 100 }, { duration: 500 });
+  },
+  '1:1': () => {
+    graph.zoomTo(1, undefined, { duration: 500 });
+  },
+};
+
 const actions = {
   'animate.buildIn & animate.buildOut': buildInOutActions,
   'animate.show & animate.hide': showHideActions,
   'animate.update': updateActions,
+  'view port': viewPortActions,
 };
 
 Object.keys(actions).forEach((groupName, i) => {

packages/site/examples/feature/features/demo/themeSwitch.js

@@ -232,7 +232,7 @@ const graph = new ExtGraph({
     {
       type: 'map-node-size',
       field: 'degree',
-      range: [4, 24],
+      range: [6, 30],
     },
   ],
   modes: {

packages/site/examples/feature/features/demo/wasmLayouts.js

@@ -95,7 +95,7 @@ fetch('https://gw.alipayobjects.com/os/basement_prod/da5a1b47-37d6-44d7-8d10-f3e
       width,
       height,
       renderer: 'webgl',
-      transform: ['transform-v4-data'],
+      transforms: ['transform-v4-data'],
       layout: layoutConfigs['force-wasm'],
       autoFit: 'view',
       modes: {

packages/site/examples/feature/features/demo/webgl3d.js

@@ -24,7 +24,9 @@ const getDegrees = (data) => {
   return degrees;
 };
 
-fetch('https://assets.antv.antgroup.com/g6/eva-3d.json')
+fetch(
+  'https://raw.githubusercontent.com/antvis/G6/317e63ba19f493317e1f7d7727a06fa96b17f295/packages/g6/tests/datasets/eva-3d-data.json',
+)
   .then((res) => res.json())
   .then((data) => {
     const degrees = getDegrees(data);

packages/site/examples/performance/perf/demo/evaWebGL.ts

@@ -57,7 +57,7 @@ const graph = new ExtGraph({
   width,
   height,
   renderer: 'webgl',
-  transform: [
+  transforms: [
     'data-format',
     {
       type: 'map-node-size',

packages/site/examples/scatter/changePosition/demo/treeAnimates.js

@@ -2,7 +2,7 @@ import { Graph, Extensions, extend } from '@antv/g6';
 
 const ExtGraph = extend(Graph, {
   edges: {
-    'quadratic-edge': Extensions.QuadraticEdge,
+    'cubic-horizontal-edge': Extensions.CubicHorizontalEdge,
   },
 });
 

packages/site/examples/scatter/changePosition/demo/viewAnimates.js

@@ -104,7 +104,7 @@ Object.keys(actions).forEach((name, i) => {
 
 if (typeof window !== 'undefined')
   window.onresize = () => {
-    if (!graph || graph.get('destroyed')) return;
+    if (!graph || graph.destroyed) return;
     if (!container || !container.scrollWidth || !container.scrollHeight) return;
-    graph.changeSize(container.scrollWidth, container.scrollHeight);
+    graph.setSize([container.scrollWidth, container.scrollHeight]);
   };